Browse commands

/impeccable colorize

Colorize

เพิ่มสีอย่างมีกลยุทธ์ให้อินเทอร์เฟซขาวดำโดยไม่ดูจัดจ้าน

เมื่อไรควรใช้

/impeccable colorize คือตัวถ่วงน้ำหนักของ “ทุกอย่างเป็นสีเทา” แดชบอร์ดที่อ่านเหมือนกำแพงสีเบจ ฟอร์มที่ไม่มีสีเน้น หน้าเนื้อหาที่เป็นผลิตภัณฑ์ SaaS ใดก็ได้ ใช้เมื่ออินเทอร์เฟซทำงานได้แต่ราบเรียบทางอารมณ์ และคุณต้องการความอบอุ่นโดยไม่ตกลงไปสู่พาเลตสี AI (ม่วงถึงชมพู นีออนฟ้า โหมดมืดเรืองแสง)

วิธีการทำงาน

สกิลเริ่มจากการอ่านสีแบรนด์ของคุณหากมี แล้วตัดสินใจว่าสีหาเหตุผลได้ที่ไหน:

  1. แอคชันหลัก ได้การแสดงออกที่แรงที่สุดของเฉดสีแบรนด์
  2. สีเน้นรอง ได้ตัวแปรที่ปรับโทนหรือจาง ไม่ใช่สีเต็มอีกสี
  3. กลางๆ ได้การปรับโทนไปทางเฉดสีแบรนด์ที่ chroma ต่ำ (ประมาณ 0.005 ถึง 0.01) ซึ่งมองไม่เห็นเกือบทุกพิกเซลแต่สร้างความสอดคล้องในจิตใต้
  4. หมวดหมู่เนื้อหา ได้ระบบสีเน้นจำกัดและตั้งใจ ไม่ใช่รุ้ง

สำคัญ: มันใช้ OKLCH แทน HSL เพื่อให้ขั้นความสว่างเท่ากันดูเท่ากัน เมื่อความสว่างเคลื่อนไปทางขอบ chroma ลดลงอัตโนมัติ นี่คือวิธีที่คุณได้สีที่รู้สึกว่าตั้งใจแทนที่จะคำนวณ

ลองใช้งาน

/impeccable colorize the dashboard

ผลลัพธ์ที่คาดหวัง:

  • สีแบรนด์ย้ายจาก hex ที่ฮาร์ดโค้ดเป็น --color-accent: oklch(62% 0.18 240)
  • กลางๆ ปรับโทนด้วย chroma 0.007 ไปทางเฉดสีแบรนด์
  • ปุ่มหลักได้สีเน้นเต็ม ปุ่มรองได้ ink/mist
  • ชุดกราฟิกใช้ 3 เฉดสีที่แตกต่าง ทั้งหมดที่ความสว่างเท่ากันจึงไม่มีชุดใดครองทางสายตา
  • ภาพสเตทว่างใช้สีเน้นอ่อน

ข้อควรระวัง

  • รันโดยไม่มีเฉดสีแบรนด์ Colorize ต้องการจุดเริ่มต้น หาก PRODUCT.md ไม่ระบุ มันจะถาม อย่าปล่อยให้มันเลือกจากดีฟอลต์พาเลตสี AI
  • คาดหวังให้มันแก้ปัญหาพาเลตสี AI หากการออกแบบของคุณมีไล่สีม่วงและนีออนฟ้าอยู่แล้ว คุณต้องการ /impeccable quieter ก่อน แล้ว colorize ถึงจะสร้างใหม่ได้
  • ใช้บนอินเทอร์เฟซที่มีสีเยอะอยู่แล้ว นั่นคืองานของ /impeccable quieter Colorize เพิ่ม ไม่ได้ลด