ฟรี

เครื่องกำเนิดจานสี

สร้างจานสีที่กลมกลืนกันสำรวจแผนการเสริมที่คล้ายคลึงกันแบบไตรอะดิกส่งออกเป็น CSS, Tailwind หรือรูปภาพ

ไฟล์ของคุณจะไม่ออกจากอุปกรณ์ของคุณ
เหลือ 10:00
#4A8CBF
rgb(74, 140, 191)
hsl(206°, 48%, 52%)
#E41B83
rgb(228, 27, 131)
hsl(329°, 79%, 50%)
#4E5AD4
rgb(78, 90, 212)
hsl(235°, 61%, 57%)
#11BB22
rgb(17, 187, 34)
hsl(126°, 83%, 40%)
#152AB2
rgb(21, 42, 178)
hsl(232°, 79%, 39%)

ปลดล็อคขีดจำกัด

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

อัพเกรดเป็นโปร

เครื่องกำเนิดจานสี คืออะไร?

โปรแกรมสร้างชุดสีฟรีของ StackPro ช่วยให้นักออกแบบและนักพัฒนาสร้างโทนสีที่สวยงามและกลมกลืนกันภายในไม่กี่วินาทีเริ่มจากสีพื้นฐานใดๆ และสำรวจฮาร์โมนีแบบเสริม อะนาล็อก ไตรอะดิก และเอกรงค์ล็อคสีที่คุณชื่นชอบ ปรับแต่งเฉดสีแต่ละเฉดด้วยเครื่องมือเลือกภาพ ตรวจสอบอัตราส่วนคอนทราสต์สำหรับการเข้าถึง และส่งออกในรูปแบบที่พร้อมสำหรับนักพัฒนา เช่น คุณสมบัติที่กำหนดเองของ CSS, การกำหนดค่า Tailwind หรือตัวแปร SCSS

วิธีใช้ เครื่องกำเนิดจานสี

  1. เลือกสีพื้นฐานโดยใช้เครื่องมือเลือกสีหรือป้อนค่าเลขฐานสิบหก
  2. เลือกโหมดฮาร์โมนี่ (เสริม อะนาล็อก ไตรอะดิก ฯลฯ)
  3. ปรับแต่งสีแต่ละสีอย่างละเอียดโดยคลิกที่ตัวอย่างใดๆ
  4. ล็อคสีที่คุณชอบแล้วกด "สร้าง" เพื่อดูรูปแบบใหม่
  5. ส่งออกจานสีสุดท้ายเป็น CSS, Tailwind, SCSS หรือดาวน์โหลดเป็น PNG

คุณสมบัติ

  • โหมดฮาร์โมนี่หลายแบบ: เสริม, อะนาล็อก, ไตรอะดิก, เตตราดิก, โมโนโครม
  • ตัวเลือกสีภาพพร้อมอินพุต hex, RGB และ HSL
  • การล็อคสีสำหรับการสร้างชุดสีแบบวนซ้ำ
  • เครื่องมือตรวจสอบอัตราส่วนคอนทราสต์ WCAG
  • ส่งออกเป็นคุณสมบัติที่กำหนดเองของ CSS, Tailwind หรือ SCSS
  • ดาวน์โหลดจานสีเป็นภาพ PNG
  • ประวัติจานสีและรายการโปรด
  • การประมวลผลฝั่งไคลเอ็นต์ 100%

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

มีโหมดความกลมกลืนของสีอะไรบ้าง?
สร้างจานสีโดยใช้ประสานสีคู่ตรงข้าม อะนาล็อก ไตรอะดิก เตตราดิก เสริมแยก และเอกรงค์คุณยังสามารถสร้างจานสีแบบกำหนดเองได้โดยการเลือกสีแต่ละสี
ฉันสามารถส่งออกพาเล็ตเพื่อการพัฒนาได้หรือไม่
ใช่!ส่งออกจานสีของคุณเป็นคุณสมบัติที่กำหนดเองของ CSS, การกำหนดค่า Tailwind CSS, ตัวแปร SCSS หรือเป็นรูปภาพ PNG ที่ดาวน์โหลดได้แต่ละรูปแบบพร้อมที่จะวางในโครงการของคุณแล้ว
ฉันจะค้นหาชุดสีที่สามารถเข้าถึงได้ได้อย่างไร
ตัวสร้างมีตัวตรวจสอบคอนทราสต์ที่ประเมินอัตราส่วนคอนทราสต์ WCAG 2.0 ระหว่างสองสีใดๆ ในพาเล็ตของคุณ ช่วยให้คุณมั่นใจในการอ่านข้อความและการปฏิบัติตามข้อกำหนดในการเข้าถึง
ฉันสามารถล็อกสีขณะสร้างพาเล็ตใหม่ได้หรือไม่
ใช่!ล็อคสีใดก็ได้ที่คุณต้องการ จากนั้นสร้างใหม่ เฉพาะสีที่ปลดล็อคเท่านั้นที่จะเปลี่ยนแปลงวิธีนี้ช่วยให้คุณสร้างชุดสีที่สมบูรณ์แบบสำหรับสีของแบรนด์ของคุณได้ซ้ำๆ