Пакетне налаштування HSL зображень

Можливості та обмеження

Інструмент призначений для швидкого застосування однакових HSL-коригувань до групи зображень без зміни їхніх розмірів. Наприклад, завантажте одне альбомне та одне портретне фото, встановіть відтінок 45°, насиченість 150% і яскравість 80%. Після натискання «Згенерувати» обидва зображення отримають фільтр hue-rotate(45deg) saturate(150%) brightness(80%), збережуть власні пропорції та відобразяться окремо. Значення 500/-20/250 будуть обмежені до 360/0/200.

Порядок фільтрів

Браузер застосовує фільтри в такому порядку: hue-rotate, saturate, brightness. Нейтральна комбінація 0/100/100 не змінює кольори. Насиченість 0 повністю прибирає кольоровість, а яскравість 0 робить зображення чорним, зберігаючи геометрію.

Що це не робить

Це не пряме налаштування HSL-світлоти, а CSS-фільтр яскравості. Точний вихідний RGB залежить від реалізації фільтрів у браузері, а не від опублікованої формули перетворення HSL. Немає масок, кривих, автоматичного балансу білого, ICC-профілів або підтримки RAW. Обробка відбувається локально в браузері, але не гарантує збереження анімацій або формату вхідного файлу.

Поради

• Сильна насиченість або яскравість може обрізати деталі, тому зберігайте оригінали.
• Інтерфейс підтримує PNG, JPEG, WebP, GIF і BMP, але фактична підтримка залежить від можливостей браузера декодувати ці формати.
• Немає автоматичного попереднього перегляду в реальному часі — після зміни параметрів обов’язково натискайте «Згенерувати».

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

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

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

Чому результат має формат PNG, а не оригінальний?

Інструмент завжди зберігає результат як PNG через canvas.toDataURL('image/png'). Вибір формату виводу не передбачений.

Що станеться, якщо я введу значення поза діапазоном?

Значення будуть обмежені: відтінок — до -360…360, насиченість і яскравість — до 0…200%. Наприклад, 500 стане 360, а -20 — 0.