UX Pilot Gradient Generator – градієнти та фактурні фони
Браузерна студія градієнтів із налаштуванням кольорів, фактури й руху та переглядом результату в макетах інтерфейсів.
Про ресурс
Colour Contrast Checker допомагає оцінити пару кольорів, перш ніж переносити її в інтерфейс. Задайте колір фону та переднього плану, щоб побачити коефіцієнт контрасту й окремі індикатори AA та AAA для звичайного й великого тексту. Такий формат зручний для швидкої перевірки підписів, заголовків і тексту на кольорових поверхнях. Для обох кольорів доступні HEX-поля та регулятори RGB і HSL. Значення можна копіювати, а командою Reverse colours — поміняти фон і передній план місцями. Це допомагає порівнювати варіанти без постійного повернення до редактора та поступово знаходити більш читабельне поєднання. У нижній частині сторінки є вибір гарнітури та приклади тексту розміром 16 px і 24 px. Вони дають змогу оцінити, як та сама пара виглядає в різних типографічних умовах, а не спиратися лише на число. Інструмент стане в пригоді під час роботи над дизайн-системою, світлою або темною темою та текстовими стилями вебсторінки. Команда Save colours зберігає вибрані пари у браузері, а адреси з параметрами фону й переднього плану дозволяють повернутися до конкретного поєднання або передати його колезі. Основний вебінструмент доступний без оплати й реєстрації. На сайті також є посилання на окреме розширення Chrome, але для перевірки двох кольорів встановлювати його не потрібно. Індикатори стосуються контрасту заданої пари для тексту. Вони не замінюють перевірку всього продукту: стани компонентів, фокус, зображення, клавіатурна навігація та інші вимоги доступності потребують окремої уваги. Для значень близько до порогів звіряйте результат із критеріями WCAG і перевіряйте кольори та розмір тексту в готовому інтерфейсі.
Використання та ліцензія
Вебінструмент безкоштовний. Опублікований вихідний код має ліцензію MIT; під час розповсюдження копій або суттєвих частин коду потрібно зберігати повідомлення про авторські права та ліцензію. Результат перевірки контрасту не є підтвердженням доступності всього продукту.
Перед використанням перевірте актуальні умови на сайті автора.Схожі ресурси
Colorsinspo — палітри, градієнти та інструменти для роботи з кольором
Безкоштовна платформа з тисячами кольорових палітр, генераторами, градієнтами, перевіркою контрасту, навчальними матеріалами та іншими інструментами для дизайнерів.
Light Rails — студія світлових патернів
Браузерна студія для геометричних патернів зі світловими лініями, градієнтами й анімацією. Налаштовуйте форму та рух, приміряйте композиції на макетах і готуйте графіку для подальшої роботи.