สร้างชุดสี

เกี่ยวกับเครื่องมือสร้างชุดสี

เลือกสีหลักของแบรนด์ แล้วรับทุกอย่างที่อินเทอร์เฟซต้องใช้รอบสีนั้น ทั้งสีประกอบ สีสถานะ สีโทนกลาง เฉดสี โทเคนธีมสว่างและธีมมืด การตรวจคอนทราสต์ และโค้ดพร้อมวาง ทั้งหมดนี้โดยไม่ต้องออกจากเบราว์เซอร์

ชุดสีครบชุดจากสีเดียว

เครื่องมือนี้สร้างสีรองและสีที่สามจากสีหลัก พร้อมสีสถานะ (ข้อมูล สำเร็จ คำเตือน อันตราย) ที่เข้ากับสไตล์ของสีหลัก และสีเทาอมสีเล็กน้อยสำหรับพื้นหลังและข้อความ

เฉดสีพร้อมใช้

ทุกสีมี 11 เฉด ตั้งแต่อ่อนที่สุด (50) ถึงเข้มที่สุด (950) สำหรับพื้นหลัง เส้นขอบ สถานะเมื่อชี้เมาส์ และข้อความ หากสีที่แนะนำไม่ถูกใจ ก็เปลี่ยนเป็นสีที่เลือกเองได้ แล้วเฉดสีจะปรับตาม

โทเคนธีมสว่างและธีมมืด

พื้นหลัง พื้นผิว เส้นขอบ ข้อความ สถานะเมื่อชี้เมาส์ โฟกัส และพื้นหลังการแจ้งเตือน สีใช้งานแต่ละสีจะอ้างอิงเฉดหนึ่งในชุดสี โดยมีค่าหนึ่งสำหรับธีมสว่างและอีกค่าสำหรับธีมมืด

ตรวจคอนทราสต์ให้แล้ว

ทุกคู่ของข้อความและพื้นหลังจะได้รับการประเมินตามเกณฑ์ WCAG คือ 4.5:1 สำหรับข้อความปกติ 3:1 สำหรับข้อความขนาดใหญ่ และ 7:1 สำหรับระดับ AAA

ส่งออกเป็น CSS, Tailwind, JSON

คัดลอกแต่ละค่าในรูปแบบ HEX, RGB, HSL หรือ OKLCH หรือดาวน์โหลดไฟล์ตัวแปร CSS ธีม Tailwind v4 ไฟล์ตั้งค่า Tailwind v3 ไฟล์ JSON หรือรายการแบบธรรมดา ทุกอย่างทำงานในเบราว์เซอร์ ไม่มีการส่งหรือบันทึกข้อมูลใด ๆ