Головна / Інструменти для кольорів / Генератор градієнтних палітр RGB
Безкоштовні онлайн-інструменти

Генератор градієнтних палітр RGB

Створіть відтворювану колірну шкалу, перегляньте кожен згенерований крок і скопіюйте точну HEX-послідовність для CSS, діаграм або дизайн-токенів.

Почати роботу

Генератор градієнтних палітр RGB

Створіть відтворювану колірну шкалу, перегляньте кожен згенерований крок і скопіюйте точну HEX-послідовність для CSS, діаграм або дизайн-токенів.

Що допомагає робити цей інструмент

Створіть відтворювану колірну шкалу, перегляньте кожен згенерований крок і скопіюйте точну HEX-послідовність для CSS, діаграм або дизайн-токенів.

Приклад роботи

Вхідні дані

#2563EB → #EC4899, 5 кольорів

Результат

#2563EB, #575CD7, #8956C2, #BA4FAE, #EC4899

Як отримується результат

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

Корисні сценарії

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

Важливі обмеження

  • Інтерполяція RGB може виглядати темнішою або бруднішою між деякими додатковими кольорами.
  • Плавна палітра не є автоматично доступною для людей з дальтонізмом.
  • Цей генератор створює рівномірно розподілені кольори RGB; він не претендує на перцептивну рівномірність.

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

Чому середня точка може виглядати сірою або брудною?

Протилежні канали RGB можуть усереднюватися до нейтрального кольору. Додайте відповідний середній колір у багатокроковому CSS-процесі, якщо важлива візуальна насиченість.

Скільки кольорів слід генерувати?

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

Кількість включає обидва кінцеві кольори; типово 10. Дробову частину відкидають, потім кількість обмежують діапазоном 2–100. Панелі дозволяють HEX, RGB, HSV і HSL, але інтерполяція завжди використовує кодовані канали RGB з округленням до цілих. Напрямок перегляду фіксований — 90°. Немає додаткових точок, альфа-каналу або вибору колірного простору. Вивід — один HEX на рядок, без CSS-коду та завантаження зображення.

Обробка виконується локально у вашому браузері.