Створіть палітру кольорів для UI
Коло гармоній, пресети настрою й UI-теми, перевірка контрасту WCAG — експорт у CSS-змінні, Tailwind, SCSS, JSON-токени чи Figma.
Як працює генератор палітр
Створюйте гармонійні колірні палітри на основі теорії кольору: коло гармоній, швидкі пресети, перевірка контрасту й експорт у будь-якому форматі.
Гармонії колірного кола
Оберіть базовий тон і створюйте комплементарні, аналогові, тріадні, розщеплено-комплементарні й тетрадні палітри за принципами теорії кольору.
Швидка генерація
Отримайте готову до продакшну палітру одним кліком. Генератор створює збалансований набір основних, додаткових, акцентних і нейтральних кольорів.
Перевірка контрасту
Вбудована перевірка контрасту WCAG показує, які поєднання кольорів відповідають стандартам доступності AA і AAA. Створюйте красиві палітри, які ще й доступні.
Експорт і збереження
Експортуйте палітри в CSS-змінні, конфіг Tailwind, SCSS або JSON. Зберігайте їх у свою бібліотеку або діліться посиланням.
Часті запитання
Колірні гармонії — це поєднання кольорів за їхнім розташуванням на колірному колі. Комплементарні кольори стоять один навпроти одного й дають сильний контраст. Аналогові — поруч і виглядають цілісно. Тріадні рівномірно віддалені й дають збалансовану різноманітність.
Типовій дизайн-палітрі потрібно 5–8 кольорів: основний колір бренду, додатковий, акцент для CTA, набір для успіху, помилки й попередження та 2–3 нейтральні сірі. Генератор допоможе зібрати все це з одного базового тону.
WCAG (Настанови з доступності вебконтенту) визначають мінімальну контрастність тексту й фону. AA вимагає 4.5:1 для звичайного тексту, AAA — 7:1. Дотримання цих стандартів гарантує, що ваш контент зможуть прочитати люди з порушеннями зору.
Так. Введіть будь-яке значення HEX, RGB чи HSL як базовий колір, і генератор побудує навколо нього гармонії. Це зручно, коли у вас уже є колір бренду і його треба розширити до повної палітри.