Design System Component Guide
- Primary Indigo#6366f1
- Secondary Coral#fb7185
- Surface Cream#fff7ed
- Border Fog#f5f5f5
- Text Graphite#1f2937
- Interactive Yellow#fde047
- Muted Gray#cbd5e1
Создано 06/28/2025 20:29
Палитра содержит светлый, темный цвета. Акцентные цвета Primary Indigo #6366f1 и Surface Cream #fff7ed. Палитра имеет цветовую температуру Холодный, Теплый, Нейтральный.
По светлоте палитра тянется от #1F2937 (самый тёмный) до #FFF7ED (самый светлый). Диапазон светлоты широкий.
В целом насыщенность выглядит яркой (высокая хрома) — 57% цветов насыщенные.
Некоторые цвета находятся почти напротив друг друга на цветовом круге, что даёт палитре комплементарный контраст.
В целом температура смещена в сторону холодного (3 из 7).
HEX-коды (по возрастанию): #1F2937, #6366F1, #CBD5E1, #F5F5F5, #FB7185, #FDE047, #FFF7ED
Палитра Design System Component Guide содержит комбинацию из 7 кодов цветов:
HEX: #6366f1, RGB: (99, 102, 241); HEX: #fb7185, RGB: (251, 113, 133); HEX: #fff7ed, RGB: (255, 247, 237)
HEX: #f5f5f5, RGB: (245, 245, 245); HEX: #1f2937, RGB: (31, 41, 55); HEX: #fde047, RGB: (253, 224, 71)
HEX: #cbd5e1, RGB: (203, 213, 225)
Упрощенная версия цветов палитры
Тёмный оттенок Умеренный аспидно-синий, Тёмный оттенок Светло-коралловый, Тёмный оттенок Цветочно-белый, Дымчато-белый, Светлый оттенок Черный, Светлый оттенок Золотой, Светлый оттенок Светло-серый
Цветовая схема создана автором raccoon
Коды цветов в палитре
Design System Component Guide коды цветов HEX, RGB информация в таблице
| Цвет | HEX | RGB | Название | Альтернативное название |
|---|---|---|---|---|
| #6366f1 | #6366f1 | RGB(99, 102, 241) | Primary Indigo | — |
| #fb7185 | #fb7185 | RGB(251, 113, 133) | Secondary Coral | — |
| #fff7ed | #fff7ed | RGB(255, 247, 237) | Surface Cream | Fatback |
| #f5f5f5 | #f5f5f5 | RGB(245, 245, 245) | Border Fog | Whitesmoke |
| #1f2937 | #1f2937 | RGB(31, 41, 55) | Text Graphite | — |
| #fde047 | #fde047 | RGB(253, 224, 71) | Interactive Yellow | — |
| #cbd5e1 | #cbd5e1 | RGB(203, 213, 225) | Muted Gray | — |
Контраст палитры цветов
8 цветовых пары имеют низкий контраст и требуют улучшения, что может повлиять на читаемость.
| Цвет текста | Цвет фона | Коэффициент контрастности |
|---|---|---|
#6366f1 | #fb7185 | 1.65 |
#fb7185 | #cbd5e1 | 1.81 |
#fff7ed | #f5f5f5 | 1.02 |
#fff7ed | #fde047 | 1.24 |
#fff7ed | #cbd5e1 | 1.39 |
#f5f5f5 | #fde047 | 1.2 |
Палитра из изображения Design System Component Guide png
Экспорт палитры
Скачайте "Design System Component Guide" в нескольких форматах для удобной интеграции в ваши дизайнерские проекты.
Доступные форматы: