Створено 06/06/2025 09:34
WebComponents Atomic UI
- Custom Atom Blue#3e92cc
- Shadow Root Gray#aab2bd
- Slot Lemon#fff3b0
- Lit Coral#ff686b
- Style Scope#1c1c1e
- Template Ivory#fffffa
Палітра містить світлий, темний кольори. Акцентні кольори Custom Atom Blue #3e92cc та Template Ivory #fffffa. Палітра має температуру кольорів Холодний, Теплий, Нейтральний.
За світлістю палітра сягає від #1C1C1E (найтемніший) до #FFFFFA (найсвітліший). Діапазон світлості широкий.
Загалом насиченість здається яскравою (висока хрома).
Деякі пари відтінків близькі до комплементарних позицій — можливе читання як комплементарний контраст (евристика).
Теплі й холодні зразки доволі збалансовані.
HEX-коди (відсортовано): #1C1C1E, #3E92CC, #AAB2BD, #FF686B, #FFF3B0, #FFFFFA
Палітра WebComponents Atomic UI містить комбінацію з 6 кодів кольорів :
HEX: #3e92cc, RGB: (62, 146, 204); HEX: #aab2bd, RGB: (170, 178, 189); HEX: #fff3b0, RGB: (255, 243, 176)
HEX: #ff686b, RGB: (255, 104, 107); HEX: #1c1c1e, RGB: (28, 28, 30); HEX: #fffffa, RGB: (255, 255, 250)
Спрощений варіант палітри кольорів
Відтінок dodgerblue, Відтінок darkgrey, Відтінок palegoldenrod, Відтінок lightcoral, Відтінок Чорний, Відтінок Білий
Кольорова схема створена автором colorhunt
Коди кольорів у палітрі
WebComponents Atomic UI коди кольорів HEX, RGB інформація у таблиці
| Колір | HEX | RGB | Назва | Альтернативна назва |
| #3e92cc | #3e92cc | RGB(62, 146, 204) | Custom Atom Blue | — |
| #aab2bd | #aab2bd | RGB(170, 178, 189) | Shadow Root Gray | — |
| #fff3b0 | #fff3b0 | RGB(255, 243, 176) | Slot Lemon | — |
| #ff686b | #ff686b | RGB(255, 104, 107) | Lit Coral | — |
| #1c1c1e | #1c1c1e | RGB(28, 28, 30) | Style Scope | — |
| #fffffa | #fffffa | RGB(255, 255, 250) | Template Ivory | — |
Контраст палітри кольорів
5 пари кольорів мають низький контраст і потребують покращення, що може вплинути на зручність читання.
| Колір тексту | Колір фону | Коефіцієнт контрастності |
#3e92cc | #aab2bd | 1.58 |
#3e92cc | #ff686b | 1.2 |
#aab2bd | #fff3b0 | 1.9 |
#aab2bd | #ff686b | 1.31 |
#fff3b0 | #fffffa | 1.11 |
Зображення палітри WebComponents Atomic UI png
Експортувати палітру
Завантажте "WebComponents Atomic UI" у кількох форматах для безшовної інтеграції у ваші дизайнерські проєкти.
Доступні формати: