← На главную
🖌️
Генератор палитр
Стройте дополнительные, аналогичные, триадные и монохромные палитры с проверкой контраста WCAG и экспортом CSS-переменных
Базовый цвет
🔒 Все вычисления в браузере, регистрация не требуется#4F46E5rgb(79, 70, 229)Синий
rgb(79, 70, 229) · Название цвета: Синий
Дополнительные
180°Нажмите на карточку цвета, чтобы сделать его базовым
#4F46E5rgb(79, 70, 229)Синий- к белому6.29Соответствует AA
- к чёрному3.34Не соответствует
#9C96F0rgb(156, 150, 240)Синий- к белому2.61Не соответствует
- к чёрному8.03Соответствует AAA
#DCE546rgb(220, 229, 70)Жёлтый- к белому1.37Не соответствует
- к чёрному15.34Соответствует AAA
#BAC31Brgb(186, 195, 27)Жёлтый- к белому1.92Не соответствует
- к чёрному10.91Соответствует AAA
Аналогичные
±30°Нажмите на карточку цвета, чтобы сделать его базовым
#468CE5rgb(70, 140, 229)Синий- к белому3.42Не соответствует
- к чёрному6.14Соответствует AA
#738AEBrgb(115, 138, 235)Синий- к белому3.20Не соответствует
- к чёрному6.56Соответствует AA
#4F46E5rgb(79, 70, 229)Синий- к белому6.29Соответствует AA
- к чёрному3.34Не соответствует
#9873EBrgb(152, 115, 235)Фиолетовый- к белому3.51Не соответствует
- к чёрному5.99Соответствует AA
#9F46E5rgb(159, 70, 229)Фиолетовый- к белому4.69Соответствует AA
- к чёрному4.48Не соответствует
Триада
120°Нажмите на карточку цвета, чтобы сделать его базовым
#4F46E5rgb(79, 70, 229)Синий- к белому6.29Соответствует AA
- к чёрному3.34Не соответствует
#E54F46rgb(229, 79, 70)Красный- к белому3.79Не соответствует
- к чёрному5.54Соответствует AA
#46E54Frgb(70, 229, 79)Зелёный- к белому1.67Не соответствует
- к чёрному12.58Соответствует AAA
Тетрада / прямоугольник
90° + 180°Нажмите на карточку цвета, чтобы сделать его базовым
#4F46E5rgb(79, 70, 229)Синий- к белому6.29Соответствует AA
- к чёрному3.34Не соответствует
#E5468Crgb(229, 70, 140)Пурпурный- к белому3.76Не соответствует
- к чёрному5.59Соответствует AA
#DCE546rgb(220, 229, 70)Жёлтый- к белому1.37Не соответствует
- к чёрному15.34Соответствует AAA
#46E59Frgb(70, 229, 159)Зелёный- к белому1.62Не соответствует
- к чёрному12.97Соответствует AAA
Монохромные
HНажмите на карточку цвета, чтобы сделать его базовым
#DCDBF0rgb(220, 219, 240)Синий- к белому1.36Не соответствует
- к чёрному15.43Соответствует AAA
#9995E5rgb(153, 149, 229)Синий- к белому2.70Не соответствует
- к чёрному7.78Соответствует AAA
#827CEDrgb(130, 124, 237)Синий- к белому3.47Не соответствует
- к чёрному6.06Соответствует AA
#4F46E5rgb(79, 70, 229)Синий- к белому6.29Соответствует AA
- к чёрному3.34Не соответствует
#180EB7rgb(24, 14, 183)Синий- к белому11.76Соответствует AAA
- к чёрному1.79Не соответствует
#0A0470rgb(10, 4, 112)Синий- к белому16.61Соответствует AAA
- к чёрному1.26Не соответствует
Светлый и тёмный предпросмотр
В палитре 17 цветовНа светлом фоне
Пример текста Aa
На тёмном фоне
Пример текста Aa
Проверка контраста
Пример текста Aa
Контрастность 6.29Соответствует AA
Экспорт и предпросмотр
:root {
--color-1: #4F46E5;
--color-2: #9C96F0;
--color-3: #DCE546;
--color-4: #BAC31B;
--color-5: #468CE5;
--color-6: #738AEB;
--color-7: #9873EB;
--color-8: #9F46E5;
--color-9: #E54F46;
--color-10: #46E54F;
--color-11: #E5468C;
--color-12: #46E59F;
--color-13: #DCDBF0;
--color-14: #9995E5;
--color-15: #827CED;
--color-16: #180EB7;
--color-17: #0A0470;
}