01
#FEFCFBФон приложения
orange-1
Radix Orange 1- RGB
rgb(254 252 251)- Чёрный текст
- 20,53:1
- Белый текст
- 1,02:1
← Назад в каталог цветов
Лаборатория сигналов
Radix Orange для заметных сигналов.
Проверенная по источнику шкала из двенадцати оранжевых токенов: от спокойных поверхностей через границы и яркие предупреждения к читаемому тексту.
- Ступени шкалы
- 01—12
- Описанные роли
- 12
- Версия
- 3.0.0
Платёж требует вниманияЗначок и подпись сохраняют смысл без цвета.
Проверить- 01Фон приложения
#FEFCFB - 02Мягкий фон
#FFF7ED - 03Фон элемента
#FFEFD6 - 04Элемент при наведении
#FFDFB5 - 05Активный элемент
#FFD19A - 06Мягкая граница
#FFC182 - 07Интерактивная граница
#F5AE73 - 08Заметная граница или индикатор фокуса
#EC9455 - 09Сплошной фон
#F76B15 - 10Сплошной фон при наведении
#EF5F00 - 11Текст с низким контрастом
#CC4E00 - 12Текст с высоким контрастом
#582D1D
Ступень 9 — основной оранжевый акцент. Для предупреждения всё равно нужны значок, подпись и программное состояние — одного цвета недостаточно.
Закреплённый источник
Точный набор Orange для светлой темы, зафиксированный в версии 3.0.0.
Справочник содержит только Orange 1–12 из непрозрачного светлого экспорта sRGB пакета @radix-ui/colors 3.0.0. Тёмные, альфа- и P3-варианты сюда не входят.
Hexees — независимый справочник, не связанный с WorkOS или Radix и не одобренный ими.
- Версия
- @radix-ui/colors 3.0.0
- Лицензия
- MIT
Компактная таблица сигналов
Двенадцать токенов, одна измеренная последовательность.
Порядок источника сохранён для поверхностей, границ, ярких акцентов и текста. В каждой компактной карточке есть точные данные sRGB и рассчитанный контраст чёрного и белого текста.
Фоны и поверхности · 01—05
Открыть цвет
02
#FFF7EDМягкий фон
orange-2
Оранжевый Tailwind 50- RGB
rgb(255 247 237)- Чёрный текст
- 19,78:1
- Белый текст
- 1,06:1
Другие форматы
03
#FFEFD6Фон элемента
orange-3
Radix Orange 3- RGB
rgb(255 239 214)- Чёрный текст
- 18,57:1
- Белый текст
- 1,13:1
Другие форматы
04
#FFDFB5Элемент при наведении
orange-4
Radix Orange 4- RGB
rgb(255 223 181)- Чёрный текст
- 16,47:1
- Белый текст
- 1,27:1
Другие форматы
05
#FFD19AАктивный элемент
orange-5
Radix Orange 5- RGB
rgb(255 209 154)- Чёрный текст
- 14,84:1
- Белый текст
- 1,42:1
Другие форматы
Границы и элементы · 06—08
06
#FFC182Мягкая граница
orange-6
Radix Orange 6- RGB
rgb(255 193 130)- Чёрный текст
- 13,20:1
- Белый текст
- 1,59:1
Другие форматы
07
#F5AE73Интерактивная граница
orange-7
Radix Orange 7- RGB
rgb(245 174 115)- Чёрный текст
- 11,18:1
- Белый текст
- 1,88:1
Другие форматы
08
#EC9455Заметная граница или индикатор фокуса
orange-8
Radix Orange 8- RGB
rgb(236 148 85)- Чёрный текст
- 8,93:1
- Белый текст
- 2,35:1
Другие форматы
Яркий сигнал и текст · 09—12
09
#F76B15Сплошной фон
orange-9
Оранжевый Radix 9- RGB
rgb(247 107 21)- Чёрный текст
- 7,07:1
- Белый текст
- 2,97:1
Другие форматы
10
#EF5F00Сплошной фон при наведении
orange-10
Radix Orange 10- RGB
rgb(239 95 0)- Чёрный текст
- 6,31:1
- Белый текст
- 3,33:1
Другие форматы
11
#CC4E00Текст с низким контрастом
orange-11
Radix Orange 11- RGB
rgb(204 78 0)- Чёрный текст
- 4,66:1
- Белый текст
- 4,51:1
Другие форматы
12
#582D1DТекст с высоким контрастом
orange-12
Radix Orange 12- RGB
rgb(88 45 29)- Чёрный текст
- 1,81:1
- Белый текст
- 11,61:1
Другие форматы
Используйте с проверкой
Оранжевый привлекает внимание, а смысл задаёт структура.
Коллекция индексируется, только пока все двенадцать опубликованных значений совпадают с зафиксированным набором. Страницы отдельных токенов остаются noindex.
Проверяйте текст, границы, индикаторы клавиатурной навигации и соседние поверхности в готовом интерфейсе. Дополняйте цвет предупреждения значком, явной подписью и программным статусом.