Frontend Developer Toolkit
- NPM Flame#cb3837
- React Sky#61dafb
- Debug Dust#f5f5f5
- Component Graphite#4a4a4a
- Hook Lavender#d6bcfa
- Responsive Teal#00b8a9
Створено 06/09/2025 16:43
Палітра містить напівтемний, світлий кольори. Акцентні кольори NPM Flame #cb3837 та Responsive Teal #00b8a9. Палітра має температуру кольорів Теплий, Холодний, Нейтральний.
За світлістю палітра сягає від #4A4A4A (найтемніший) до #F5F5F5 (найсвітліший). Діапазон світлості широкий.
Загалом насиченість здається яскравою (висока хрома) — 67% кольорів яскраві.
Деякі кольори розташовані майже навпроти один одного на колірному колі, що дає палітрі комплементарний контраст.
Загалом температура зміщена в бік холодного (3 із 6).
HEX-коди (відсортовано): #00B8A9, #4A4A4A, #61DAFB, #CB3837, #D6BCFA, #F5F5F5
Палітра Frontend Developer Toolkit містить комбінацію з 6 кодів кольорів :
HEX: #cb3837, RGB: (203, 56, 55); HEX: #61dafb, RGB: (97, 218, 251); HEX: #f5f5f5, RGB: (245, 245, 245)
HEX: #4a4a4a, RGB: (74, 74, 74); HEX: #d6bcfa, RGB: (214, 188, 250); HEX: #00b8a9, RGB: (0, 184, 169)
Спрощений варіант палітри кольорів
Світлий відтінок Малиново-червоний, Темний відтінок Небесно-блакитний, Димчасто-білий, Темний відтінок Тьмяно-сірий, Світлий відтінок Сливовий, Темний відтінок Світлий морський зелений
Кольорова схема створена автором colorstudio
Коди кольорів у палітрі
Frontend Developer Toolkit коди кольорів HEX, RGB інформація у таблиці
| Колір | HEX | RGB | Назва | Альтернативна назва |
|---|---|---|---|---|
| #cb3837 | #cb3837 | RGB(203, 56, 55) | NPM Flame | — |
| #61dafb | #61dafb | RGB(97, 218, 251) | React Sky | — |
| #f5f5f5 | #f5f5f5 | RGB(245, 245, 245) | Debug Dust | Whitesmoke |
| #4a4a4a | #4a4a4a | RGB(74, 74, 74) | Component Graphite | Gray29 |
| #d6bcfa | #d6bcfa | RGB(214, 188, 250) | Hook Lavender | — |
| #00b8a9 | #00b8a9 | RGB(0, 184, 169) | Responsive Teal | — |
Контраст палітри кольорів
6 пари кольорів мають низький контраст і потребують покращення, що може вплинути на зручність читання.
| Колір тексту | Колір фону | Коефіцієнт контрастності |
|---|---|---|
#cb3837 | #4a4a4a | 1.75 |
#61dafb | #f5f5f5 | 1.48 |
#61dafb | #d6bcfa | 1.03 |
#61dafb | #00b8a9 | 1.53 |
#f5f5f5 | #d6bcfa | 1.54 |
#d6bcfa | #00b8a9 | 1.47 |
Палітра із зображення Frontend Developer Toolkit png
Експортувати палітру
Завантажте "Frontend Developer Toolkit" у кількох форматах для безшовної інтеграції у ваші дизайнерські проєкти.
Доступні формати: