Змішувач кольорів

Що робить змішувач кольорів

Інструмент обчислює точну суміш двох непрозорих RGB-кольорів за заданою пропорцією. Для кожного з двох вхідних кольорів доступна панель із синхронізованими значеннями HEX, RGB, HSV і HSL. За замовчуванням використовуються кольори #2563EB та #F97316, а баланс дорівнює 50%.

Баланс визначає частку другого кольору. Якщо поставити 0%, результат дорівнює першому кольору; якщо 100% — другому. Значення поза діапазоном від 0% до 100% обмежуються.

Формула змішування

Кожен канал R, G або B обробляється окремо:

result = first × (1 − k) + second × k

тут k — частка другого кольору від 0 до 1. Проміжні значення каналів округлюються до найближчого цілого байта, тому HEX-результат не містить дробових чисел.

Контрольний приклад

Змішаємо #2563EB і #F97316 у пропорції 50%. Для каналу R отримуємо (37 + 249) / 2 = 143, що відповідає 0x8F. Для каналу G: (99 + 115) / 2 = 107, тобто 0x6B. Для каналу B: (235 + 22) / 2 = 128.5; після округлення до найближчого байта маємо 0x81.

Результат: #8F6B81. Це числова sRGB-середина, а не обов’язково такий колір, який людське око сприймає як візуальний центр між синім і помаранчевим.

Обмеження та типові помилки

• Інструмент не змішує фізичну фарбу чи чорнило та не працює в сприйманих просторах Lab або OKLab.
• Прозорість, альфа-канали, градієнти та багатокольорові рецепти не розраховуються.
• Ручне редагування поля результату змінює лише підсумковий колір і не впливає на вихідні кольори або баланс.
• Однакове числове значення може виглядати по-різному на різних моніторах, у браузерах, профілях кольору та під час друку.

Практичний чек-лист

• Отримайте HEX для коду, а потім порівняйте його з RGB або HSL у панелі результату.
• Перевірте контраст тексту на отриманому кольорі за WCAG.
• Для серії станів кнопки використовуйте кроки балансу 10%, 20%, 30% тощо.
• Перед остаточним використанням подивіться на колір на цільовому пристрої або в друкованому макеті.

Поширені запитання

Чому результат візуально не виглядає як середина?

Тому що канали інтерполюються у числовому просторі sRGB, а зір людини нелінійний. Навіть точна 50% суміш за формулою може сприйматися темнішою або світлішою, ніж очікувалося.

Чи можна ввести колір через HSV або HSL?

Так. Синхронізовані поля HEX, RGB, HSV і HSL дають змогу задати кожен вхідний колір у зручному форматі й одразу побачити еквівалентні значення.

Що станеться з результатом після ручного редагування?

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