Генератор палітр – Гармонійні кольорові палітри

Створюйте гармонійні кольорові палітри миттєво

Вибір кольорів, які добре поєднуються один з одним, — одне з найпоширеніших завдань у дизайні. Правила кольорової гармонії, засновані на відношеннях між відтінками на кольоровому колі, дають надійну основу для створення збалансованих палітр.

Цей генератор палітр бере будь-який базовий колір і застосовує стандартні правила гармонії для створення набору гармонійних кольорів. Введіть колір у форматі HEX, RGB або HSL і перемикайтеся між типами гармонії, щоб досліджувати різні комбінації.

Типи кольорової гармонії

• Комплементарна — два кольори один навпроти одного на кольоровому колі (180°). Високий контраст, сміливі поєднання.
• Аналогічна — три сусідні кольори на кольоровому колі (30°). Природно гармонійні, низький контраст.
• Тріадна — три кольори, рівномірно розподілені по колу (120°). Яскраві та збалансовані.
• Розділено-комплементарна — базовий колір плюс два кольори, сусідні з його комплементом (150° і 210°). М'якша, ніж чиста комплементарна.
• Тетрадна (квадратна) — чотири кольори, рівномірно розподілені по колу (90°). Багаті, складні палітри.

Як користуватися генератором палітр

1. Введіть базовий колір — введіть значення HEX, RGB або HSL або використовуйте вбудований вибір кольору
2. Оберіть тип гармонії в селекторі
3. Перетягніть пов'язану точку на колі, щоб змінити відтінок і насиченість, а потім налаштуйте світлоту
4. Перегляньте згенеровану палітру у вигляді кольорових зразків
5. Копіюйте значення HEX або RGB для будь-якого зразка одним кліком
6. Перемикайтеся між типами гармонії, щоб порівнювати різні палітри

Коли використовувати генератор палітр

• При початку нового дизайн-проєкту, коли потрібна збалансована кольорова схема
• При створенні фірмового стилю навколо певного основного кольору
• При створенні UI-тем з гармонійними акцентними кольорами
• При дослідженні кольорових відношень для ілюстрації чи мистецтва
• Для швидкого створення палітр для презентацій чи прототипів

Основна гармонія та допоміжні варіанти

Кожна гармонія створює п’ять зразків. Комплементарна має два основні кольори, аналогова, тріадна й розділено-комплементарна — три, а тетрадна — чотири; решта є допоміжними варіантами зі зміненою насиченістю або світлотою.

П’ять кольорів з одного базового кольору

Позначений базовий колір зберігається, поки колірне коло обчислює гармонію та варіанти. Для домінантних кольорів усього зображення використовуйте Екстрактор палітри зображення, а для точного кольору одного пікселя — Піпетку.

Використовуйте HEX, RGB, HSL та OKLCH

Поле приймає HEX, RGB, HSL та OKLCH. Копіюйте окремий колір у HEX або RGB чи всю палітру як п’ять розділених комами HEX-кодів у верхньому регістрі.

Швидко, безкоштовно та конфіденційно

Усі обчислення відбуваються в браузері. Немає облікового запису, завантаження, зберігання чи серверної обробки; коло працює з мишею, дотиком і клавіатурою.

Колірне коло показує теоретичні зв’язки, але не гарантує читабельності. Для вимірювання WCAG використовуйте Перевірку контрастності, а для зміни формату — Конвертер кольорів.

Часті запитання

Що таке кольорова гармонія?

Кольорова гармонія — це поєднання кольорів, які візуально приємні разом, засновані на їхніх відношеннях на кольоровому колі.

Який тип гармонії обрати?

Залежить від мети дизайну. Комплементарна створює сильний контраст. Аналогічна — спокійне відчуття. Тріадна — яскрава та збалансована. Розділено-комплементарна дає м'якший контраст. Тетрадна дає багаті, складні палітри.

Які формати кольорів можна вводити?

Можна вводити HEX, RGB, HSL або OKLCH; формат визначається автоматично.

Як розраховуються кольори палітри?

Базовий колір перетворюється на HSL і розміщується під точними кутами відтінку вибраної гармонії. Кожне поєднання розширюється до п’яти практичних зразків зі збалансованими варіаціями насиченості та світлоти. Інтерактивне коло показує кожен зразок: перетягування однієї точки обертає всю гармонію, а повзунок світлоти оновлює палітру.

Чи можна копіювати згенеровані кольори?

Так. Копіюйте кожен колір у HEX або RGB чи всю палітру як п’ять розділених комами HEX-кодів у верхньому регістрі.

Чи працює цей інструмент на мобільних?

Так. Адаптивне колірне коло працює з дотиком на телефоні та з мишею або клавіатурою на комп’ютері.

Цей інструмент безкоштовний?

Так. ColourPicker.app повністю безкоштовний, реєстрація не потрібна.

Чи можна зберігати згенеровані палітри?

Інструмент не зберігає палітри між сесіями. Ви можете копіювати окремі значення кольорів і зберігати їх у файлах проєкту.

Що показує колірне коло?

Воно розміщує відтінки по колу: кут задає тон, відстань від центру — насиченість, а окремий повзунок — світлоту.

Чому кожна палітра містить п’ять кольорів?

П’ять зразків дають сталий робочий набір із двох–чотирьох основних кольорів і потрібних допоміжних варіантів.

Що таке основні кольори та допоміжні варіанти?

Основні кольори утворюють вибрану геометрію; варіанти повторюють ці тони з іншою насиченістю або світлотою.

Чи гарантує гармонія достатній контраст?

Ні. Гармонія описує зв’язки відтінків; WCAG-контраст переднього плану й тла потрібно вимірювати окремо.