Що таке шкала відтінків
Це ряд відтінків, що походять від одного кольору: від майже білого варіанта до майже чорного. Усі вони мають однаковий базовий тон, тому легко поєднуються між собою.
Світлі, темні та приглушені відтінки
Світлий відтінок — це колір, змішаний з білим: світліший і ніжніший. Темний відтінок — колір, змішаний з чорним: темніший і глибший. Приглушений тон — колір, змішаний із сірим: стриманіший і елегантніший.
Як використати шкалу в дизайні
Світлі відтінки (50–200) використовуйте для фонів, середні (400–600) для кнопок і посилань, а темні (700–950) для тексту й рамок. Однієї шкали досить для впорядкованого й цілісного інтерфейсу.
Часті запитання
Як обчислюється шкала?
Ми використовуємо колірний простір OKLCH, який імітує, як око сприймає світлість. Тож кроки між відтінками виглядають рівними, без різких стрибків.
Що означають числа від 50 до 950?
Це шкала, яку використовують Tailwind CSS і багато дизайн-систем: 50 — найсвітліший відтінок, 950 — найтемніший. Ваш колір потрапляє на число, яке йому найкраще відповідає.
Чи можна використати шкалу в Tailwind або CSS?
Так. Введіть назву, оберіть формат і скопіюйте код: змінні CSS, готові до вставлення, або блок кольорів для конфігурації Tailwind.
Чим шкала відтінків відрізняється від палітри кольорів?
Шкала — це відтінки одного кольору. Палітра поєднує різні кольори, що пасують один до одного. Багато палітр використовують шкалу для фонів і тексту та один-два акцентні кольори.