Цвета и контраст
Переводите цвета между HEX, RGB и HSL, подбирайте оттенки и дополнительные цвета, стройте градиенты и проверяйте, что текст на фоне соответствует требованиям доступности по контрасту.
Инструменты для дизайна
Помощники для дизайнеров и фронтенда: конвертация и подбор цветов, оттенки и градиенты, проверка контраста, сжатие и изменение размера изображений, генерация CSS. Картинки обрабатываются на вашем устройстве.
30 показано
01 PNG в JPG Кладет PNG на белый фон и сохраняет JPEG.converter02 JPG в PNG Перекодирует JPEG в PNG.converter03 Изображение в WebP Кодирует PNG, JPEG или WebP в WebP.converter04 Изображение в AVIF Кодирует изображение в AVIF прямо в браузере.converter05 Сжатие изображений Уменьшает JPEG или WebP ползунком качества.converter06 Изменение размера Вписывает изображение в ширину и высоту.converter07 Кадрирование Выделите прямоугольник и сохраните область.converter08 Сведения об изображении Тип, размеры и вес из самого файла.converter09 Генератор QR-кодов Создаёт QR-код и скачивает PNG.converter10 Штрихкод CODE128, CODE39, EAN-13 и UPC.converter11 Форматы цвета HEX, RGB и HSL из одного значения.developer12 Выбор цвета Выберите цвет и прочитайте каналы.developer13 Контраст Контраст WCAG для двух цветов.developer14 Песочница HTML HTML, CSS и JS в изолированном фрейме.developer15 CSS-градиент Собирает линейный градиент и копирует CSS.developer16 Тень блока Настройте тень и скопируйте свойство.developer17 Песочница Flexbox Направление, перенос, выравнивание и промежуток.developer18 Генератор Grid Колонки, ряды и промежуток как CSS Grid.developer19 Адаптивный предпросмотр Смотрите HTML на ширине телефона, планшета и компьютера.developer20 Единицы CSS px, rem, em, pt и проценты.developer21 Соотношение сторон Сокращает ширину и высоту в пикселях.developer22 CSS clamp() Объявление clamp() из трёх длин.developer23 Типографическая шкала Модульная шкала кегля в пикселях.developer24 Оттенки цвета Пять более светлых и тёмных ступеней одного hex.developer25 Дополнительный цвет Противоположный оттенок hex-цвета.developer26 Шкала отступов Ряд отступов от базы и коэффициента.developer27 Заглушка SVG Небольшой SVG с подписью. Без хостинга картинок.developer28 Буквенный аватар SVG-аватар из одной буквы.developer29 CSS-радиус Объявление border-radius.developer30 CSS-фильтр Размытие и яркость как объявление filter.developer
Подробнее
Картинки, готовые для сайта
Сжимайте, обрезайте, меняйте размер и формат изображений прямо в браузере, чтобы страницы грузились быстрее. Картинки никуда не загружаются.
FAQ
Частые вопросы
Можно ли перевести HEX в RGB?
Да. Цветовые инструменты переводят HEX, RGB, HSL и другие форматы и сразу показывают превью.
Картинки загружаются на сервер для сжатия?
Нет. Сжатие и изменение размера выполняются в браузере.
Инструменты генерируют CSS-код?
Да. Генераторы градиентов, теней, скруглений, фильтров и сеток выдают готовый CSS для копирования.