Дизайн

Конвертер цветов

Преобразуйте HEX, RGB и HSL с прозрачностью, смотрите образец цвета и копируйте готовые значения CSS.

Проверка контраста цветов

Проверьте контраст по WCAG 2.2 с образцом текста и отдельными оценками AA и AAA для обычного и крупного шрифта.

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

Создавайте линейные и радиальные градиенты с двумя–восемью цветовыми точками и копируйте CSS.

Генератор теней CSS

Настройте смещение, размытие, расширение, цвет и непрозрачность внешней или внутренней тени CSS.

Калькулятор соотношения сторон

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

Генератор CSS Grid

Настройте фиксированную или адаптивную сетку в живом предпросмотре и получите CSS и HTML.

Генератор CSS Flexbox

Проверьте направление, перенос, распределение и выравнивание и скопируйте соответствующий CSS и HTML.

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

Создавайте комплементарные, аналоговые, триадные и монохромные палитры с экспортом HEX, CSS и JSON.

Генератор скруглений CSS

Настраивайте радиусы четырёх углов вместе или отдельно, проверяйте эллиптические скругления и экспортируйте border-radius.

Генератор многоугольного clip-path

Перемещайте вершины или вводите координаты, проверяйте форму обрезки и экспортируйте CSS многоугольника.

Редактор CSS-кривых cubic-bezier

Настройте две контрольные точки, проверьте переход в движении и получите функцию плавности cubic-bezier.

Генератор плавного размера шрифта clamp()

Рассчитайте адаптивный font-size: clamp() по минимальному и максимальному размеру текста и ширине окна, в px или rem.

Генератор CSS-фильтров для изображений

Проверяйте размытие, яркость, цвет и прозрачность на примере или локальном изображении и экспортируйте filter CSS.

Генератор CSS-трансформаций 2D и 3D

Настройте сдвиг, поворот, масштаб, наклон и точку преобразования, при необходимости добавив перспективу и 3D.

Размеры бумаги и расчёт пикселей для печати

Форматы A, ISO B, C, Letter, Legal и Tabloid: миллиметры, дюймы, пункты и пиксели с учётом ориентации и вылетов.

Оптимизация SVG и конвертация в PNG

Очистите и оптимизируйте SVG, сравните размер и вид, затем сохраните SVG или PNG нужных размеров с прозрачным либо одноцветным фоном.