เครื่องมือเลือกสีฟรี

ทำงานในเบราว์เซอร์ทั้งหมด ไม่ต้องอัปโหลด ไม่ต้องสมัครสมาชิก

สีที่เลือก#3366cc

สี HEX

แดง 51เขียว 102น้ำเงิน 204อัลฟา 1

เฉดสีความอิ่มตัวความสว่าง

HSL220, 60%, 50%

HEX#3366cc

HEX8#3366ccff

RGBrgb(51, 102, 204)

HSLhsl(220, 60%, 50%)

HSVhsv(220, 75%, 80%)

CMYKcmyk(75%, 50%, 0%, 20%)

แชร์เครื่องมือนี้

เครื่องมือเลือกสีคืออะไร?

เครื่องมือเลือกสีช่วยเลือกสีดิจิทัลให้ตรงค่า แล้วคัดลอกค่าสีสำหรับงานออกแบบหรือเขียนโค้ด ใช้แถบสี ช่อง HEX สไลเดอร์ RGB หรือการควบคุม HSL จากนั้นคัดลอกค่า HEX, RGB, HSL, HSV หรือ CMYK ได้ทันที ทุกอย่างทำงานในเบราว์เซอร์

วิธีใช้งาน

1เลือกหรือวางค่าสี. คลิกแถบสีขนาดใหญ่เพื่อเปิดตัวเลือกสีของเบราว์เซอร์ หรือวางค่า hex แบบ 3, 4, 6 หรือ 8 หลักในช่อง HEX
2ปรับช่องสี. ใช้สไลเดอร์ RGB สำหรับสีแดง เขียว น้ำเงิน และอัลฟา หรือแก้ hue, saturation และ lightness เมื่อต้องการควบคุมแบบเหมาะกับงานออกแบบมากขึ้น
3คัดลอกรูปแบบที่ต้องใช้. คัดลอก HEX, HEX8, RGB, HSL, HSV หรือ CMYK ได้ในคลิกเดียว ตัวอย่างสีและค่าทุกช่องอัปเดตแบบสด

เหมาะกับใคร

นักพัฒนา front-end ที่ต้องคัดลอกค่า HEX, RGB และ HSL พร้อมใช้กับ CSS ระหว่างสร้างอินเทอร์เฟซ
นักออกแบบ ที่ต้องการปรับสีแบรนด์ตามช่องสี แทนการเดาในแอปกราฟิก
ทีมการตลาด ที่ต้องจับคู่สีแคมเปญให้ตรงกันในเครื่องมือทำอีเมล เอกสาร และสื่อโซเชียล
นักเรียนและครีเอเตอร์ ที่อยากเข้าใจว่า RGB, HSL, HSV และ CMYK อธิบายสีเดียวกันอย่างไร

เครื่องมือเลือกสีนี้เริ่มจากแถบสีที่มองเห็นได้ชัด และวางตัวเลขค่าสีไว้ใกล้ ๆ คุณสามารถวางค่า hex ของ CSS เช่น #3366cc ปรับช่องสีแดง เขียว น้ำเงิน และอัลฟา หรือปรับ hue, saturation และ lightness สำหรับงาน design system ได้ ไม่มีการอัปโหลดค่าสี - การแปลงค่าทั้งหมดเกิดขึ้นภายในเครื่องด้วย JavaScript

คำถามที่พบบ่อย

เครื่องมือเลือกสีนี้ใช้ฟรีหรือไม่?

ใช่ เครื่องมือเลือกสีนี้ใช้ฟรี ไม่ต้องสมัคร และไม่มีขีดจำกัดการใช้งาน เปิดหน้า เลือกสี แล้วคัดลอกรูปแบบที่ต้องการได้เลย

ค่าสีของฉันถูกอัปโหลดไปที่ไหนหรือไม่?

ไม่ เครื่องมือเลือกสีและการแปลงค่าทำงานในเบราว์เซอร์ด้วย JavaScript ธรรมดา สีที่เลือกจะไม่ถูกส่งไปยังเซิร์ฟเวอร์

คัดลอกรูปแบบค่าสีใดได้บ้าง?

คัดลอกได้ทั้ง HEX, HEX แบบ 8 หลักพร้อมอัลฟา, RGB หรือ RGBA, HSL หรือ HSLA, HSV และ CMYK เครื่องมือจะซิงก์ค่าทั้งหมดขณะแก้ไข

วางค่าสี hex ได้หรือไม่?

ได้ วางค่า hex ของ CSS แบบ 3, 4, 6 หรือ 8 หลักได้ ทั้งมีหรือไม่มีเครื่องหมาย # ค่าย่อจะขยายตามกฎ CSS ปกติ

HEX8 คืออะไร?

HEX8 คือค่าสี hex 8 หลัก โดยคู่สุดท้ายใช้เก็บค่าอัลฟา เช่น #3366cc80 คือสีน้ำเงินเดิมที่มีความทึบประมาณ 50%

ควรใช้ RGB หรือ HSL ใน CSS?

ใช้ RGB เมื่อต้องการค่าช่องสีที่ตรงเป๊ะ หรือใช้อัลฟากับ rgba() ใช้ HSL เมื่อต้องสร้างสีอ่อน สีเข้ม หรือสถานะ UI ที่เกี่ยวข้องกันด้วยการปรับ saturation และ lightness