เครื่องมือสร้างพาเลตสี
เครื่องมือสร้างพาเลตสีฟรี: สร้างชุดสีที่กลมกลืน (สีข้างเคียง สีคู่ตรงข้าม สีสามเส้า และอื่นๆ) ล็อกสีที่ชอบ แล้วส่งออกเป็น HEX หรือ CSS
เพิ่มเติม: พาเลตสีจากรูปภาพและตัวเลือกสี · เครื่องมือตรวจสอบคอนทราสต์สี
ใช้ทำอะไร
เครื่องมือนี้สร้างพาเลตสีสำหรับเว็บไซต์ แอป งานนำเสนอ และงานออกแบบ เลือกรูปแบบความกลมกลืนเพื่อสร้างสีที่เข้ากันจากสีฐาน หรือกดแป้นเว้นวรรคเพื่อสุ่มพาเลต แล้วล็อกสีที่ชอบไว้เพื่อให้เปลี่ยนเฉพาะสีอื่น สีต่างๆ คำนวณในปริภูมิสี OKLCH ซึ่งรักษาความสว่างที่รับรู้ได้แม้เฉดสีจะเปลี่ยน พาเลตจึงดูสมดุล คัดลอกสีเป็น HEX ตัวแปร CSS หรือ JSON หรือแชร์พาเลตด้วยลิงก์
วิธีใช้
- เลือกรูปแบบความกลมกลืนและสีฐาน หรือคงไว้ที่ “สุ่ม”
- กดแป้นเว้นวรรคหรือ “สร้าง” จนกว่าจะได้พาเลตที่ชอบ แล้วล็อกสีที่ต้องการเก็บไว้
- คลิกรหัสสีเพื่อคัดลอก หรือคัดลอกทั้งพาเลตเป็น HEX, CSS หรือ JSON
คำถามที่พบบ่อย
รูปแบบความกลมกลืนแต่ละแบบหมายถึงอะไร
เป็นการจับคู่สีแบบคลาสสิกจากวงล้อสี สีข้างเคียงใช้เฉดที่อยู่ติดกันเพื่อให้ดูสงบ สีคู่ตรงข้ามใช้เฉดที่อยู่ตรงข้ามกันเพื่อคอนทราสต์ที่ชัด สีสามเส้าและสี่สีกระจายสามหรือสี่เฉดอย่างเท่าๆ กัน สีคู่ตรงข้ามแบบแยกทำให้คู่ตรงข้ามนุ่มนวลลง และสีเดียวใช้เฉดเดียวในหลายระดับความเข้ม
ทำไมใช้ OKLCH ไม่ใช่ HSL
ใน HSL สีเหลืองและสีน้ำเงินที่มีค่าความสว่างเท่ากันกลับดูสว่างต่างกันมาก OKLCH ออกแบบตามการรับรู้ของมนุษย์ เมื่อหมุนเฉดสี สีจึงยังสว่างเท่ากัน และนี่คือเหตุผลที่ปริภูมิสีนี้ถูกเพิ่มเข้าไปใน CSS
ตรวจสอบได้ไหมว่าสีอ่านง่ายหรือไม่
ได้ ใช้เครื่องมือตรวจสอบคอนทราสต์เพื่อดูว่าข้อความสีหนึ่งบนพื้นหลังอีกสีหนึ่งผ่านระดับการเข้าถึงของ WCAG หรือไม่