Все инструменты для тестирования экрана

    Генератор градиентных изображений

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

    • Линейные и радиальные градиенты
    • Скачивание изображения и CSS

    Укажите целые числа от 1 до 8192 для каждой стороны, не более 16,777,216 пикселей всего. Изображения создаются в браузере.

    HEX · #RRGGBB
    HEX · #RRGGBB

    Предпросмотр

    1920 × 1080 px
    Генератор градиентных изображений

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

    background: linear-gradient(90deg, #2563eb, #e879f9);

    CSS и PNG могут немного отличаться из-за особенностей интерполяции цветов в браузерах.

    Тест градиента

    Как пользоваться

    1. Задайте размеры изображения и выберите линейный или радиальный градиент.
    2. Выберите начальный и конечный цвета, при желании добавьте промежуточный цвет и настройте угол линейного градиента.
    3. Скачайте PNG или JPEG либо скопируйте CSS-декларацию фона.

    Условия и ограничения

    Инструмент создаёт декоративные градиентные фоны. Для проверки полос используйте отдельный тест градиента. Созданное изображение не подтверждает разрядность или точность цветопередачи дисплея.

    Частые вопросы

    Что означает угол градиента?

    Углы соответствуют CSS: 0° — снизу вверх, 90° — слева направо, 180° — сверху вниз. Радиальный градиент начинается в центре.

    Будет ли скачанный градиент точно совпадать с CSS?

    Цвета и направление одинаковы, но интерполяция цветов в браузере и масштабирование изображения могут давать небольшие отличия. Если важен фиксированный результат в пикселях, используйте скачанное изображение.

    Другие инструменты

    Генератор пустых прозрачных изображений

    Создайте полностью прозрачный пустой PNG нужного размера. Проверьте прозрачность в предпросмотре и скачайте изображение для макетов, наложений или дизайна.

    Генератор одноцветных изображений

    Создайте одноцветное изображение с нужным HEX-цветом и точными размерами. Скачайте PNG или JPEG для простых обоев, фона или визуального образца на экране.

    Генератор изображений-заглушек

    Создайте изображение-заглушку с размерами или своим текстом. Настройте цвета фона и текста, задайте точные размеры и скачайте PNG либо JPEG для макета.