Що таке конвертер кольорів?
Конвертер кольорів перетворює одне значення кольору у формати, які зазвичай використовуються у веб‑дизайні, CSS, системах дизайну та нотатках для передачі. Один і той самий бренд‑колір може зберігатися як HEX у гайдлайні, як RGB у токені дизайну, як HSL у редакторі теми та як CMYK у примітках для друку. Цей інструмент зберігає ці представлення разом, щоб ви могли скопіювати потрібну версію без ручних перерахунків.
Конвертер спеціально компактний. Він фокусується на практичних веб‑кольорах sRGB: HEX, RGB, HSL, HSV та простому наближенні CMYK. Він не призначений замінювати професійне програмне забезпечення для управління кольором або робочі процеси з профілями ICC.
Підтримувані формати кольорів
| Format | Example | Найкраще використовується для |
|---|---|---|
| HEX | #3366FF | CSS, токени дизайну, швидка візуальна передача |
| RGB | rgb(51, 102, 255) | Значення CSS, робота з canvas, програмні канали кольору |
| HSL | hsl(225, 100%, 60%) | Налаштування теми за відтінком, насиченістю та світлотою |
| HSV | hsv(225, 80%, 100%) | Робочі процеси у стилі піпетки та візуальне налаштування |
| CMYK | cmyk(80%, 60%, 0%, 0%) | Приблизні нотатки для друку, не остаточне налаштування кольору для друку. |
Важливі обмеження
- Вихідний CMYK обчислюється зі значень sRGB і є лише наближенням.
- Іменовані кольори CSS, градієнти, Lab, LCH, OKLCH і Display‑P3 не входять до цього компактного обсягу v1.
- Альфа‑значення можуть бути розпарсені для поширених форм HEX/RGB/HSL, але вбудований перегляд зразка показує непрозорий базовий колір.
- Різні інструменти дизайну можуть трохи по‑різному округлювати значення HSL, HSV або CMYK.
Типові робочі процеси
Очищення CSS
Вставте HEX‑код кольору зі стилевого гайдлайна та скопіюйте RGB або HSL для стану компонента, палітри діаграми або змінної теми.
Передача дизайну
Тримайте кілька позначень кольору разом, коли розробник, дизайнер або контент‑редактор використовує різні інструменти.
Перевірка токенів
Перевірте, чи відповідає токен кольору очікуваному відтінку та насиченості перед використанням у публічному інтерфейсі.
Нотатки для друку
Згенеруйте приблизні значення CMYK для обговорення, залишивши остаточний друк профільно‑орієнтованим інструментам.
Поширені запитання
Чи є вихідний CMYK точним?
Ні. Значення CMYK — це просте перетворення з sRGB, корисне для чорнових нотаток. Остаточна робота для друку залежить від паперу, чорнила, налаштувань преса та профілів ICC.
Чи можу я вставляти CSS‑функції кольору?
Так — для поширених синтаксисів функцій RGB, HSL, HSV та у стилі CMYK. Новіші простори кольору, такі як Lab, LCH, OKLCH і Display‑P3, навмисне не охоплені цим компактним інструментом.
Чи підтримує інструмент альфа‑прозорість?
Він може розпарсити поширені форми альфа, такі як RGBA, HSLA та восьмизначний HEX, але головний зразок і скопійований результат орієнтовані на практичні непрозорі веб‑кольори.
Чому значення інколи відрізняються від іншого інструменту дизайну?
Невеликі відмінності зазвичай виникають через правила округлення або припущення при управлінні кольором. Для веб‑кольорів sRGB ці відмінності зазвичай незначні.
Коли слід замість цього використовувати перевірку контрасту?
Використовуйте перевірку контрасту, коли потрібно порівняти два кольори для читабельності тексту. Цей конвертер змінює лише один колір між форматами.