สร้างพาเลตสีที่กลมกลืนจากวงล้อสีแบบอินเทอร์แอคทีฟ — ใช้กฎความสามัคคีเช่น analogous, complementary หรือ triad แล้วคัดลอกค่าใดก็ได้ทันที

ความสว่าง 100%
กฎความสามัคคี
สีที่เลือก
HEX
RGB
HSL
พาเลต

เลือกกฎความสามัคคีและสีพื้นฐาน จากนั้นลากตัวทำเครื่องหมายบนวงล้อเพื่อปรับแต่ง คลิก swatch ใดก็ได้เพื่อคัดลอก หรือตั้งเป็นสีพื้นฐานใหม่


เกี่ยวกับ สร้างพาเลตสี

Color Palette Generator สร้างชุดสีที่กลมกลืนกันจากวงล้อสีแบบโต้ตอบได้ เลือกสีตั้งต้น เลือกกฎความกลมกลืน ไม่ว่าจะเป็น analogous, monochromatic, triad, complementary, split complementary, square, shades หรือกำหนดเองทั้งหมด แล้วเครื่องมือจะคำนวณชุดสีที่เข้ากันทันที พร้อมตัวชี้ที่ลากได้บนวงล้อเพื่อปรับแต่งอย่างละเอียด

สวอตช์แต่ละอันแสดงค่า HEX, RGB, HSL และ HSB และสีใด ๆ ในชุดสีก็สามารถเลื่อนขึ้นเป็นสีตั้งต้นใหม่ได้ด้วยคลิกเดียว แถบเลื่อนความสว่างจะปรับทั้งชุดสีให้สว่างขึ้นหรือเข้มขึ้นในขณะที่ความสัมพันธ์ของเฉดสียังคงล็อกไว้ ทำให้สำรวจรูปแบบต่าง ๆ ของชุดสีได้อย่างรวดเร็ว

ทุกอย่างคำนวณแบบเรียลไทม์ในเบราว์เซอร์ของคุณโดยใช้คณิตศาสตร์ทฤษฎีสีบนวงล้อ HSV ไม่มีการอัปโหลดและไม่มีการติดต่อกับเซิร์ฟเวอร์ เมื่อชุดสีดูเหมาะสมแล้ว คัดลอกค่าแต่ละค่า สีทั้งหมดพร้อมกัน ตัวแปร CSS สำเร็จรูป หรือไฟล์ JSON

วิธีใช้ สร้างพาเลตสี

  1. เลือกสีตั้งต้นด้วยตัวเลือกสี พิมพ์ค่า หรือคลิก "Random"
  2. เลือกกฎความกลมกลืน เช่น analogous, complementary, triad หรือ square
  3. ลากตัวชี้บนวงล้อและปรับแถบเลื่อนความสว่างเพื่อปรับแต่งชุดสี
  4. คลิกสวอตช์เพื่อคัดลอก หรือกำหนดให้เป็นสีตั้งต้นใหม่เพื่อทำซ้ำ
  5. ส่งออกชุดสีด้วย "Copy all", "Copy CSS variables" หรือ "Copy JSON"

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

ใช่ ฟรีทั้งหมด การคำนวณชุดสีทำงานอยู่ในเบราว์เซอร์ของคุณทั้งหมด จึงไม่มีเครดิต บัญชี หรือข้อจำกัดในการใช้งาน

แต่ละกฎจะวางสีอื่น ๆ ในชุดสีที่มุมคงที่รอบวงล้อสีเทียบกับสีตั้งต้นของคุณ complementary อยู่ตรงข้ามกัน (180°) triad วางสีห่างกัน 120° analogous เก็บสีข้างเคียงไว้ใกล้กัน split complementary ขนาบสองข้างของเฉดสีตรงข้าม และ square วางสี่เฉดสีห่างกัน 90°

ชุดสีแบบ analogous หรือ monochromatic ปลอดภัยที่สุดสำหรับอินเทอร์เฟซ เพราะให้ความรู้สึกสงบและกลมกลืน ใช้ complementary หรือ split complementary เมื่อต้องการสีเน้นที่โดดเด่นสำหรับปุ่มและปุ่มกระตุ้นการกระทำเทียบกับเฉดสีหลัก

ได้ สลับไปที่กฎ Custom แล้วลากตัวชี้แต่ละอันบนวงล้ออย่างอิสระ หรือเริ่มจากกฎความกลมกลืนใดก็ได้แล้วลากตัวชี้เพื่อปรับ เครื่องมือจะอัปเดตชุดสีให้ตามที่คุณเลื่อน

สวอตช์ทุกอันแสดงค่า HEX, RGB, HSL และ HSB ซึ่งคัดลอกได้ทีละค่า คุณยังคัดลอกชุดสีทั้งหมดเป็นค่าธรรมดา เป็น CSS custom properties ที่พร้อมใช้ในสไตล์ชีต หรือเป็น JSON สำหรับส่งต่อให้โค้ดหรือเครื่องมือออกแบบ

แชร์สิ่งนี้

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

เพิ่มเครื่องมือฟรีนี้ลงในเว็บไซต์ของคุณเอง — คัดลอกและวางโค้ดด้านล่าง