/impeccable colorize
Colorize
Добавьте стратегический цвет в монохромные интерфейсы без крикливости.
Когда использовать
/impeccable colorize — это противовес «всё серое». Дашборды, которые выглядят как бежевая стена, формы без акцента, контентные страницы, которые могут быть любым SaaS-продуктом. Обращайтесь к нему, когда интерфейс функционален, но эмоционально плоский, и вы хотите теплоты без скатывания в ИИ-палитру (фиолетово-розовый, неоновый голубой, свечение в тёмном режиме).
Как это работает
Навык начинает с чтения вашего фирменного цвета, если он есть, затем решает, где цвет оправдывает своё присутствие:
- Основное действие получает самое сильное выражение фирменного оттенка.
- Вторичные акценты получают приглушённые или оттенённые варианты, а не второй полный цвет.
- Нейтральные оттеняются в сторону фирменного оттенка с низкой насыщенностью (около 0.005–0.01), что почти незаметно в пиксель, но создаёт подсознательное единство.
- Категории контента получают ограниченную, осознанную систему акцентов, а не радугу.
Важно, что он использует OKLCH вместо HSL, чтобы равные шаги светлоты выглядели равными. По мере движения светлоты к крайним значениям насыщенность автоматически снижается. Так вы получаете цвет, который выглядит продуманным, а не вычисленным.
Попробуйте
/impeccable colorize the dashboard
Ожидаемый diff:
- Фирменный цвет перенесён из захардкоженного hex в
--color-accent: oklch(62% 0.18 240) - Нейтральные оттенены с насыщенностью 0.007 в сторону фирменного оттенка
- Основная кнопка получает полный акцент, вторичные кнопки — ink/mist
- Серия графиков использует 3 различных оттенка, все с одинаковой светлотой, поэтому ни одна серия визуально не доминирует
- Иллюстрация пустого состояния получает мягкую акцентную заливку
Подводные камни
- Запуск без фирменного оттенка. Colorize нужен стартовый цвет. Если
PRODUCT.mdего не указывает, он спросит. Не позволяйте ему выбирать из умолчаний ИИ-палитры. - Ожидание исправления проблемы ИИ-палитры. Если ваш дизайн уже имеет фиолетовые градиенты и неоновый голубой, сначала нужен
/impeccable quieter, затем colorize сможет перестроить. - Использование на уже цветных интерфейсах. Это задача
/impeccable quieter. Colorize добавляет, он не убирает.