วงล้อสี — วงล้อเลือกสีออนไลน์และสีเสริม
ใช้แบบโต้ตอบนี้ วงล้อสี ถึง เลือกสี, หา สีเสริม, และสำรวจ คล้ายคลึงกัน- ไตรเอดิก- เตตราดิก, และ แยกเสริม แผนงาน เป็นวิธีที่รวดเร็วในการจับคู่สี ทดสอบสีที่ตัดกัน และสร้างการผสมสีที่เข้ากันได้ดี
คุณสมบัติ
- แบบโต้ตอบ ล้อเลือกสี (HSV) พร้อมการลากที่ราบรื่นและอินพุตที่แม่นยำ (HEX/RGB/HSL)
- ทันที เครื่องกำเนิดสีเสริม บวกกับตัวเลือกอะนาล็อก, ไตรอะดิก, แยกเสริม, เตตราดิก และเอกรงค์
- คำแนะนำความคมชัดของ WCAG สำหรับข้อความ UI ที่อ่านได้และการใช้ปุ่ม สีตัดกัน-
- ส่งออกจานสีไปที่ PNG- SVG, หรือ ตัวแปรซีเอสเอส เพื่อการส่งมอบที่รวดเร็ว
- ผ้าใบตอบสนองที่คงความสมบูรณ์ วงกลมสี มองเห็นได้ในทุกหน้าจอ
การใช้งาน
การสร้างแบรนด์และ UI: สร้างจานสีที่กลมกลืนซึ่งสอดคล้องกับบุคลิกภาพของแบรนด์คุณ ใช้ วงล้อสีเสริม เพื่อสร้าง CTA ที่มีผลกระทบสูง หรือ สีสามเหลี่ยม รูปแบบสำหรับการนำทางและสีแผนภูมิที่สมดุล
ภาพประกอบและเครื่องแต่งกาย: สำรวจ แผนการที่คล้ายกัน เพื่อการไล่ระดับสีที่ให้ความรู้สึกเป็นธรรมชาติ เมื่อคุณต้องการสีที่เข้ากันได้ดีกับเสื้อผ้า เครื่องมือนี้ช่วยคุณได้ หาสีที่เข้ากัน ที่ดูโดดเด่น (“สีที่เข้ากันพอดี”)
ภายในและสี: แปล วงล้อสี RGB ถึงก วงล้อสี ความคิด; เริ่มต้นด้วยสีสมอของคุณและทดสอบ สีตรงข้าม หรือปิดเสียง สีระดับอุดมศึกษา เพื่อความสมดุล
กล่าวคือวันที่: เลือกจานสีที่มีความเปรียบต่างเพียงพอสำหรับแผนภูมิ ก แยกเสริม มักจะหลีกเลี่ยงความสับสนในขณะที่ยังคงรักษาความหลากหลายไว้
มันทำงานอย่างไร
- เลือกสี: ลากบนวงล้อหรือป้อน HEX/RGB/HSL
- เลือกโครงการ: เสริม, คล้ายคลึง, ไตรอะดิก, แยกเสริม, เตตราดิกหรือเอกรงค์
- ปรับแต่งค่า: ปรับความสว่าง (ค่า) เพื่อควบคุมแสง/ความมืด
- ตรวจสอบความคมชัด: ตรวจสอบให้แน่ใจว่าข้อความตรงตาม WCAG บนพื้นหลังสีอ่อน/สีเข้ม
- ส่งออก: ดาวน์โหลด PNG/SVG หรือคัดลอกตัวแปร CSS สำหรับ dev hand-off
เคล็ดลับ: เมื่อคุณต้องการความรวดเร็ว เครื่องกำเนิดการผสมสีเริ่มต้นด้วย Single → Complementary → Triadic เพื่อเปรียบเทียบอารมณ์และความสามารถในการอ่าน
คำถามที่พบบ่อย
วงล้อสีในทฤษฎีสีคืออะไร?
ที่ วงล้อทฤษฎีสี จัดเรียงเฉดสีเป็นวงกลมเพื่อให้คุณมองเห็นความสัมพันธ์ต่างๆ เช่น ความสัมพันธ์ที่คู่กัน (ตรงกันข้าม) คล้ายคลึงกัน (เพื่อนบ้าน) และไตรอะดิก (เว้นระยะห่างเท่าๆ กัน) มันเป็นพื้นฐานสำหรับ ความกลมกลืนของสี และเลือกสีที่เข้ากัน
ฉันจะค้นหาสีคู่ตรงข้ามได้อย่างไร
เลือกสีพื้นฐาน ของมัน สีเสริม นั่งตรงข้ามกับพวงมาลัย ใช้รูปแบบ "เสริม" ของแอปเพื่อสร้างคู่ทันทีและประเมินคอนทราสต์
สีหลัก สีรอง และสีตติยภูมิคืออะไร?
เฉดสีหลักคือสีพื้นฐาน การผสมสีเหล่านี้จะทำให้ได้สีรอง และการผสมสีหลักกับสีรองที่อยู่ใกล้เคียงกัน สีระดับอุดมศึกษาขึ้นรูปเป็นวงล้อ 12 สีสุดคลาสสิก
วงล้อสี RGB กับวงกลมสีเพ้นท์?
ที่ วงล้อสี RGB แบบจำลองแสงเสริมสำหรับหน้าจอ ล้อทาสี RYB แบบดั้งเดิมเป็นแบบลบ คู่เสริมจะแตกต่างกันเล็กน้อยระหว่างรุ่น
สายรุ้งเรียงตามลำดับอะไร?
แดง, ส้ม, เหลือง, เขียว, น้ำเงิน, คราม, ม่วง—มีประโยชน์เมื่อสร้าง วงล้อสเปกตรัมสี หรือสอนพื้นฐานทฤษฎีสี
สีอะไรเข้ากันได้ดีกับ UI?
พยายาม คล้ายคลึงกัน เพื่อความกลมกลืนที่ราบรื่น ไตรเอดิก เพื่อคอนทราสต์ที่สมดุล หรือ เสริม เพื่อการเน้นที่ชัดเจน (ปุ่ม, การแจ้งเตือน) ตรวจสอบอัตราส่วนความคมชัดเสมอ
อภิธานศัพท์ (ทฤษฎีสี)
สีเสริม: เฉดสีตรงข้ามบนวงล้อที่เพิ่มคอนทราสต์สูงสุด (เช่น น้ำเงิน ↔ สีส้ม)
คล้ายคลึงกัน: เฉดสีข้างเคียงที่สร้างการไล่ระดับสีที่อ่อนโยนและการทำงานร่วมกันของภาพ
ไตรเอดิก: สามเฉดสีห่างกัน 120°; มีชีวิตชีวาแต่ก็สมดุล
เตตราดิก: สองคู่เสริม; รวยแต่ต้องอาศัยความสมดุลอย่างระมัดระวัง
ประถมศึกษา/มัธยมศึกษา/อุดมศึกษา: เฉดสีพื้นฐาน ส่วนผสม และขั้นกลางในวงล้อ 12 สี
ฮิว/ความอิ่มตัว/ค่า (HSV): มุมบนวงล้อ ความเข้มของสี และความสว่าง
การเข้าถึงและความคมชัด
ใช้คำใบ้ที่ตัดกันเพื่อให้แน่ใจว่าข้อความสามารถอ่านได้ สำหรับข้อความปกติ ให้ตั้งอัตราส่วนเป็น ≥ 4.5:1- สำหรับข้อความขนาดใหญ่ ≥ 3:1- หากมีข้อสงสัย ให้เลือกพื้นหลังที่สว่างกว่าและสีตรงข้ามที่เข้มกว่า หรือเพิ่มความสว่าง/ค่าเพื่อให้อ่านได้ชัดเจนยิ่งขึ้น
