Безкоштовні онлайн-інструменти, що працюють у браузері
Безкоштовні інструменти Color & Design, що працюють на 100% у вашому браузері. Без завантажень, без реєстрації, без встановлення — ваші дані ніколи не залишають пристрій.
Піпетка кольорів (Color Picker)
Оберіть колір і миттєво скопіюйте значення HEX, RGB та HSL. Створюйте світліші й темніші відтінки для фонів, рамок і станів інтерфейсу.
Конвертер HEX RGB
Конвертуйте кольори між HEX, RGB(A) і HSL(A) з оновленням наживо, підтримкою альфа-каналу та готовими до копіювання значеннями CSS.
Генератор палітр кольорів
Генеруйте гармонійні палітри кольорів з базового кольору, зокрема комплементарні, аналогові, тріадні та монохромні схеми, просто у вашому браузері.
Генератор CSS-градієнтів
Створюйте лінійні та радіальні CSS-градієнти з кількома кольоровими точками, живим попереднім переглядом і готовим до копіювання кодом CSS background.
Генератор Box Shadow
Створюйте CSS-тіні box-shadow за допомогою повзунків зміщення, розмиття, розтягування, кольору, прозорості та режиму inset із живим попереднім переглядом.
Перевірка контрасту (Contrast Checker)
Перевірте коефіцієнт контрасту WCAG між кольорами тексту й фону, з результатами AA та AAA (пройдено/не пройдено) і живим попереднім переглядом.
Генератор відтінків Tailwind
Створіть 11-ступеневу шкалу відтінків у стилі Tailwind (50-950) з базового кольору HEX із CSS-змінними та JSON, готовими до копіювання.
Генератор CSS-фільтрів
Створюйте ефекти CSS filter() візуально за допомогою повзунків розмиття, яскравості, контрасту, відтінків сірого, обертання відтінку та іншого.
Генератор Border Radius
Створюйте стандартні та еліптичні значення CSS border-radius із живим попереднім переглядом і готовим CSS-кодом для копіювання — просто у браузері.
Генератор глассморфізму
Створюйте CSS для карток із ефектом матового скла: розмиття, прозорість, відтінок, рамка та радіус — прямо у вашому браузері.
Генератор неоморфізму
Генеруйте неоморфний CSS у стилі soft UI з парними тінями, кольором поверхні, радіусом і плоскою, угнутою або опуклою формою просто в браузері.
Генератор дуотону
Застосуйте двокольоровий ефект дуотону до зображення прямо в браузері та експортуйте результат у PNG — без завантаження чого-небудь на сервер.
Міксер кольорів — змішування двох кольорів
Змішуйте два кольори в обраній пропорції RGB та копіюйте отримані значення HEX, RGB і HSL прямо у браузері.
Пошук назви кольору — найближчий колір CSS
Знайдіть найближчу назву кольору CSS для будь-якого значення HEX за відстанню RGB, зі зразками кольорів і кнопками копіювання.
Генератор CSS-тем
Оберіть кольори бренду та згенеруйте на стороні клієнта тему :root із користувацькими властивостями CSS і похідними токенами для hover, меж і поверхонь.
Генератор SVG-хвиль
Створюйте багатошарові SVG-хвилі з налаштуванням амплітуди, складності, плавності та кольорів. Копіюйте SVG або CSS чи завантажуйте SVG і PNG.
Генератор блобів
Генеруйте випадкові органічні SVG-блоби з налаштуванням кількості точок, випадковості, градієнтних заливок і контурів. Копіюйте SVG або завантажуйте PNG.
Генератор mesh-градієнтів
Створюйте mesh-градієнти з 3–6 перетягуваних кольорових точок із розмиттям і шумом. Копіюйте CSS або завантажуйте зображення PNG.
Генератор CSS clip-path
Редагуйте фігури CSS clip-path візуально за допомогою пресетів, перетягуваних точок полігона та повзунків. Копіюйте CSS clip-path.