1
#FCFCFCФон приложения
gray-1
Radix Gray 1- RGB
rgb(252 252 252)- Чёрный текст
- 20,47:1
- Белый текст
- 1,03:1
← Вернуться в каталог цветов
Калибровка нейтралей интерфейса
Одна серая шкала. Двенадцать осмысленных ролей.
Читайте Radix Gray как непрерывную систему интерфейса: от спокойных фонов страницы через состояния компонентов и границы к сплошным заливкам и тексту. Копируйте точные значения, не смешивая их назначение.
- Ступени шкалы
- 1 → 12
- Группы ролей
- 5
- Версия
- 3.0.0
Источник и границы
Точный непрозрачный экспорт светлой Gray, закреплённый на версии 3.0.0.
Справочник содержит только Gray 1–12 из непрозрачного светлого экспорта sRGB пакета @radix-ui/colors 3.0.0. Тонированные нейтрали, тёмная тема, alpha- и P3-значения намеренно исключены.
Hexees — независимый справочник, не связанный с WorkOS или Radix и не одобренный ими.
- Версия
- @radix-ui/colors 3.0.0
- Источник
- Версионированный экспорт пакета
- Лицензия
- MIT
Тональный инструмент
Выбирайте по роли, а не на глаз.
Ступени сохраняют официальный порядок источника и документированную категорию применения. Контраст с чёрным и белым текстом рассчитан только для этой точной пары и не является общей гарантией доступности.
2
#F9F9F9Спокойный фон
gray-2
Radix Gray 2- RGB
rgb(249 249 249)- Чёрный текст
- 19,95:1
- Белый текст
- 1,05:1
3
#F0F0F0Фон компонента
gray-3
Radix Gray 3- RGB
rgb(240 240 240)- Чёрный текст
- 18,43:1
- Белый текст
- 1,14:1
4
#E8E8E8Компонент при наведении
gray-4
Radix Gray 4- RGB
rgb(232 232 232)- Чёрный текст
- 17,14:1
- Белый текст
- 1,23:1
5
#E0E0E0Активный компонент
gray-5
Серый Material 300- RGB
rgb(224 224 224)- Чёрный текст
- 15,91:1
- Белый текст
- 1,32:1
6
#D9D9D9Ненавязчивая граница
gray-6
Radix Gray 6- RGB
rgb(217 217 217)- Чёрный текст
- 14,88:1
- Белый текст
- 1,41:1
7
#CECECEИнтерактивная граница
gray-7
Radix Gray 7- RGB
rgb(206 206 206)- Чёрный текст
- 13,34:1
- Белый текст
- 1,57:1
8
#BBBBBBВыраженная граница или фокус
gray-8
Radix Gray 8- RGB
rgb(187 187 187)- Чёрный текст
- 10,94:1
- Белый текст
- 1,92:1
9
#8D8D8DСплошная заливка
gray-9
Radix Gray 9- RGB
rgb(141 141 141)- Чёрный текст
- 6,33:1
- Белый текст
- 3,32:1
10
#838383Сплошная заливка при наведении
gray-10
Radix Gray 10- RGB
rgb(131 131 131)- Чёрный текст
- 5,54:1
- Белый текст
- 3,79:1
11
#646464Приглушённый текст
gray-11
Radix Gray 11- RGB
rgb(100 100 100)- Чёрный текст
- 3,55:1
- Белый текст
- 5,92:1
12
#202020Контрастный текст
gray-12
Radix Gray 12- RGB
rgb(32 32 32)- Чёрный текст
- 1,29:1
- Белый текст
- 16,29:1
Повторное использование канонической записи
Gray 5 использует уже проверенный цвет.
Точное значение #E0E0E0 уже принадлежит индексируемой записи Material Grey 300. Hexees связывает gray-5 с этой канонической страницей, а остальные одиннадцать записей Radix оставляет noindex.
Проверяйте реальную типографику, границы, индикаторы фокуса, соседние поверхности и интерактивные состояния. Роли Radix и рассчитанные коэффициенты не гарантируют соответствие готового компонента WCAG.
Открыть проверку контраста →Сравнить акцентные цвета Radix →