Просмотр цвета
Превью цвета
Текст на этом фоне
Этот цвет как текст
⚠️ Проверка читаемости текста (WCAG)
Aa
Белый текст на этом фоне
Подходит для светлого текста на тёмном фоне
—
—
Aa
Чёрный текст на этом фоне
Подходит для тёмного текста на светлом фоне
—
—
💡 Как читать: коэффициент контраста показывает, насколько текст выделяется на фоне.
Минимум для обычного текста — 4.5 : 1 (уровень AA).
Чем выше число — тем лучше читаемость.
Используй этот тест, чтобы выбрать правильный цвет текста для своего фона.
Ввод кода цвета
Поддерживаемые форматы:
#ff0000 #f00 ff0000
rgb(255,0,0) rgba(255,0,0,0.5)
hsl(0,100%,50%) hsla(...)
red tomato cornflowerblue
Выбор цвета из палитры
#6c5ce7
Пресеты (20 цветов)
Код цвета — нажмите чтобы скопировать
✓ Скопировано в буфер обмена!
Описание приложения
 |
Админ
опубликовано 16.08.26
обновлено 16.08.26 |
Возможности:
Это приложение для работы с цветами и их кодами в разных форматах.- выбор цвета из палитры для отображения его кода
- ввод кода цвета для просмотра
- конвертация кода цвета из одного формата в другие форматы
- определение уровня контрастности цвета
- копирование кода цвета в разных форматах
- копирование цвета в форматах HEX, RGB, RGBA, HSL, HSLA, HWB, CSS, SCSS
- ввод кода текста в форматах HEX, RGB, HSL,
- поддержка 140 имён цветов (red, tomato и другие)
Можно работать в двух направлениях.
1. Узнать код цвета при выборе цвета из палитры.
Выберите один из цветов из набора или любой оттенок из расширенной палитры. В окне предпросмотра отобразится тот же цвет, который вы выбрали в палитре, а ниже в блоке с кодами вы сможете увидеть код выбранного цвета в самых разных форматах: HEX, RGB, RGBA, HSL, HSLA, HWB, CSS, SCSS
2. Узнать как выглядит цвет по его коду.
В блоке "выбор цвета" введите код цвета и в окне предпросмотра сможете увидеть как именно выглядит этот цвет а ниже скопировать код этого же цвета в других форматах.
Можно ввети код цвета в одном из популярных форматах: HEX, RGB, HSL вы сможете не только увидеть сам цвет но и конвертировать его код в остальные форматы: RGBA, HSLA, HWB, CSS, SCSS
Также можно ввести стандартное имя цвета на английском языке чтобы увидеть сам цвет и узнать его точный код. Например введите назватие красного цвета red и в окне предпросмотра отобразится сам цвет а в блоке для копирования кода можно будет увидеть код красного цвета.
Ниже окна просмотра цвета также можно проверить уровень констрастности выбранного цвета к белому и чёрному.
