Створено 06/14/2025 19:48
Web Onboarding Component Flow
- Step Mint#a0f0c0
- Progress Indigo#7f9cf5
- CTA Peach#ffe5b4
- Instruction Grey#e2e8f0
- Confirm Navy#334155
- Overlay Soft White#f9fafb
Палітра містить світлий кольори. Акцентні кольори Progress Indigo #7f9cf5 та CTA Peach #ffe5b4. Палітра має температуру кольорів Холодний, Теплий, Нейтральний.
За світлістю палітра сягає від #334155 (найтемніший) до #F9FAFB (найсвітліший). Діапазон світлості широкий.
Насиченість змішана — є приглушені й більш яскраві акценти.
Деякі пари відтінків близькі до комплементарних позицій — можливе читання як комплементарний контраст (евристика).
Загалом температура зміщена в бік холодного.
HEX-коди (відсортовано): #334155, #7F9CF5, #A0F0C0, #E2E8F0, #F9FAFB, #FFE5B4
Палітра Web Onboarding Component Flow містить комбінацію з 6 кодів кольорів :
HEX: #a0f0c0, RGB: (160, 240, 192); HEX: #7f9cf5, RGB: (127, 156, 245); HEX: #ffe5b4, RGB: (255, 229, 180)
HEX: #e2e8f0, RGB: (226, 232, 240); HEX: #334155, RGB: (51, 65, 85); HEX: #f9fafb, RGB: (249, 250, 251)
Спрощений варіант палітри кольорів
Відтінок aquamarine, Відтінок cornflowerblue, Відтінок moccasin, Відтінок aliceblue, Відтінок darkslateblue, Відтінок whitesmoke
Кольорова схема створена автором colourlock
Коди кольорів у палітрі
Web Onboarding Component Flow коди кольорів HEX, RGB інформація у таблиці
| Колір | HEX | RGB | Назва | Альтернативна назва |
| #a0f0c0 | #a0f0c0 | RGB(160, 240, 192) | Step Mint | — |
| #7f9cf5 | #7f9cf5 | RGB(127, 156, 245) | Progress Indigo | — |
| #ffe5b4 | #ffe5b4 | RGB(255, 229, 180) | CTA Peach | Mouse Nose |
| #e2e8f0 | #e2e8f0 | RGB(226, 232, 240) | Instruction Grey | — |
| #334155 | #334155 | RGB(51, 65, 85) | Confirm Navy | — |
| #f9fafb | #f9fafb | RGB(249, 250, 251) | Overlay Soft White | — |
Контраст палітри кольорів
7 пари кольорів мають низький контраст і потребують покращення, що може вплинути на зручність читання.
| Колір тексту | Колір фону | Коефіцієнт контрастності |
#a0f0c0 | #7f9cf5 | 1.97 |
#a0f0c0 | #ffe5b4 | 1.08 |
#a0f0c0 | #e2e8f0 | 1.08 |
#a0f0c0 | #f9fafb | 1.27 |
#ffe5b4 | #e2e8f0 | 1 |
#ffe5b4 | #f9fafb | 1.17 |
Зображення палітри Web Onboarding Component Flow png
Експортувати палітру
Завантажте "Web Onboarding Component Flow" у кількох форматах для безшовної інтеграції у ваші дизайнерські проєкти.
Доступні формати: