/impeccable colorize
Colorize
Добавете стратегически цвят към монохромни интерфейси, без да ставате крещящи.
Кога да се използва
/impeccable colorize е противотежестта на “всичко е сиво”. Табла за управление, които се четат като бежова стена, формуляри без акцент, съдържателни страници, които биха могли да са всеки SaaS продукт. Обърнете се към него, когато интерфейсът е функционален, но емоционално плосък, и искате топлина без да се накланяте към AI палитрата (лилаво-розово, циан неон, тъмен режим със сияние).
Как работи
Умението започва, като прочита вашия бренд цвят, ако съществува такъв, след което решава къде цветът печели мястото си:
- Основното действие получава най-силното изражение на бренд нюанса.
- Вторичните акценти получават приглушени или нюансирани варианти, не втори пълен цвят.
- Неутралните се нюансират към бренд нюанса при ниска хрома (около 0.005 до 0.01), което е почти невидимо за пиксел, но създава подсъзнателна свързаност.
- Категориите съдържание получават ограничена, целенасочена акцентна система, не дъга.
Важно е, че използва OKLCH вместо HSL, така че равни стъпки на светлост изглеждат равни. Тъй като светлостта се движи към крайностите, хромата спада автоматично. Така получавате цвят, който се усеща обмислен, вместо изчислен.
Пробвайте
/impeccable colorize the dashboard
Очакван diff:
- Бренд цветът преместен от хардиран hex към
--color-accent: oklch(62% 0.18 240) - Неутралните нюансирани с 0.007 хрома към бренд нюанса
- Основният бутон получава пълния акцент, вторичните бутони получават мастило/мъглявина
- Серията на графиката използва 3 различни нюанса, всички със съответна светлост, така че нито една серия не доминира визуално
- Илюстрацията на празно състояние поема мек акцентен валяк
Клопки
- Изпълнение без бренд нюанс. Colorize се нуждае от отправна точка. Ако
PRODUCT.mdне указва такава, ще попита. Не позволявайте да избира от AI цветовите палитри по подразбиране. - Очакване да поправи проблема с AI палитрата. Ако дизайнът ви вече има лилави градиенти и циан неон, първо ви трябва
/impeccable quieter, след което colorize може да изгради наново. - Използване върху вече цветни интерфейси. Това е работа за
/impeccable quieter. Colorize добавя, не изважда.