Skip to main content
🎨

Инструменты: Инструменты для дизайна

Генераторы CSS, инструменты для работы с цветом и создание SVG

26 инструментов
🎨

Конвертер цветовых кодов

Конвертация между цветовыми кодами HEX, RGB и HSL. Используйте палитру цветов и предпросмотр в реальном времени для интуитивного выбора цвета.

🎨

Палитра цветов

Выбирайте цвета с помощью цветового колеса и ползунков. Получайте и копируйте цветовые коды в форматах HEX, RGB и HSL.

🎨

Извлечение цветов из изображения

Автоматическое определение доминирующих цветов изображения и генерация цветовой палитры. Также можно нажать на любую точку изображения для выбора цвета.

🎯

Определение среднего цвета изображения

Вычисление среднего цвета всего изображения или выделенной области. Полезно для подбора цветовых схем или фоновых цветов миниатюр.

🌈

Генератор CSS-градиентов

Визуально создавайте CSS-градиенты с помощью перетаскивания. Поддержка линейных, радиальных и конических градиентов с предустановками.

🔲

Генератор CSS Box Shadow

Визуально создавайте CSS box-shadow с помощью ползунков. Поддержка нескольких теней и внутренних теней.

Генератор CSS Border Radius

Генерируйте CSS border-radius с индивидуальным управлением углами. Включает эллиптический радиус и популярные предустановки форм.

Генератор CSS Text Shadow

Генерируйте CSS text-shadow с предпросмотром в реальном времени. Накладывайте несколько теней с предустановками: неон, тиснение и другие.

🔺

Генератор CSS-треугольников

Генерируйте CSS-треугольники с помощью свойства border. Поддержка всех 8 направлений с настраиваемыми размером и цветом.

✂️

Генератор CSS Clip Path

Визуально создавайте CSS clip-path формы перетаскиванием. Включает полигон, круг, эллипс и предустановки: звезда, сердце.

🪟

Генератор CSS Glassmorphism

Создавайте эффекты матового стекла с предпросмотром и CSS-кодом. Тонкая настройка прозрачности, размытия, рамки и тени.

Генератор CSS-загрузчиков

Выбирайте из множества CSS-анимаций загрузки и получайте код. Настраивайте цвет, размер и скорость для спиннеров, точек, полос и других.

📐

Генератор CSS Flexbox

Визуально создавайте Flexbox-макеты и генерируйте CSS-код. Настраивайте все свойства со встроенной шпаргалкой.

📈

Генератор CSS Cubic Bezier

Визуально создавайте кривые плавности CSS-анимаций. Перетаскивайте ручки и просматривайте анимации в реальном времени.

🎨

Генератор оттенков цвета

Создавайте вариации оттенков от светлого к тёмному для любого цвета. Настраивайте количество шагов и экспортируйте как палитру Tailwind CSS.

🎨

Смешивание цветов

Смешивание двух и более цветов в заданных пропорциях для создания новых цветов. Сравнение результатов в различных цветовых пространствах: RGB, HSL и LAB.

🎨

Генератор цветовых палитр

Генерация цветовых палитр на основе базового цвета и теории цвета. Включает комплементарные, аналогичные, триадные и другие цветовые схемы.

🔤

Предпросмотр веб-шрифтов

Предпросмотр веб-шрифтов из Google Fonts в реальном времени. Сравнивайте несколько шрифтов, настраивая размер и цвет.

🎨

Справочник HTML-цветов по названиям

Просмотр всех 148 именованных цветов HTML/CSS в одном месте. Поиск, предварительный просмотр и копирование HEX-кодов.

🔲

Генератор фоновых CSS-паттернов

Генерация фоновых паттернов на чистом CSS. Настройка полос, точек, клеток и других узоров в визуальном редакторе.

📜

Генератор CSS-скроллбара

Настройка дизайна CSS-скроллбара в визуальном редакторе. Изменение цвета, ширины, скругления углов и копирование кода.

🌈

Генератор градиентного CSS-текста

Генерация CSS-кода для применения градиентов к тексту. Предпросмотр цветов, направления и диапазона в реальном времени.

☑️

Генератор CSS-чекбоксов

Создание пользовательских CSS-чекбоксов в визуальном редакторе. Свободная настройка анимаций, цветов и форм.

🔘

Генератор CSS-переключателей

Создание пользовательских CSS-переключателей в визуальном редакторе. Настройка размера, цвета и анимации с экспортом кода.

🫧

Генератор SVG-блобов

Автоматическая генерация органических SVG-форм (блобов). Настройка случайности и сложности для декорирования веб-дизайна.

🔷

Генератор SVG-паттернов

Генерация повторяющихся SVG-паттернов. Настройка типа паттерна, цвета и размера с экспортом кода.