Что такое Base64-изображение?

Base64-изображение — это способ представления бинарных данных изображения в виде обычного текста с использованием схемы кодирования Base64. Вместо ссылки на внешний файл всё изображение встраивается напрямую в виде строки ASCII-символов. Это широко применяется в HTML и CSS через data URI (data:image/png;base64,...), позволяя включать изображения inline без дополнительных HTTP-запросов. Кодирование в Base64 увеличивает размер данных примерно на 33%, однако устраняет необходимость в отдельном хостинге файлов и дополнительных сетевых обращениях.

Описание инструмента

Этот инструмент генерирует случайные изображения с настраиваемыми паттернами и размерами, а затем выводит результат в виде строки, закодированной в Base64. Выберите один из пяти визуальных паттернов — шум, прямоугольники, круги, градиенты или линии — задайте ширину и высоту до 2048×2048 пикселей и выберите формат вывода (PNG, JPEG или WebP). Изображение генерируется полностью в браузере с использованием Canvas API, без загрузки на сервер и внешних зависимостей.

Примеры

Случайный шум при размере 256×256 создаёт красочный статичный паттерн, в котором каждый пиксель получает случайное значение RGB — похоже на телевизионные помехи, но в полном цвете.

Случайные круги при размере 512×512 рисуют от 10 до 40 полупрозрачных кругов различных размеров и цветов на случайном фоне, создавая абстрактную композицию в виде пузырей.

Случайный градиент при размере 800×400 смешивает от 2 до 6 случайных цветов вдоль линейного градиента со случайным углом, создавая плавные цветовые переходы, подходящие для фонов.

Возможности

  • Пять различных типов паттернов: шум, прямоугольники, круги, градиент и линии
  • Настраиваемые размеры от 1×1 до 2048×2048 пикселей
  • Три формата вывода: PNG, JPEG и WebP
  • Мгновенный вывод Base64 с возможностью копирования и скачивания одним кликом
  • Работает полностью в браузере — никакие данные не покидают ваше устройство

Описание параметров

  • Ширина / Высота: задайте размеры изображения в пикселях (1–2048). Изменения обрабатываются с задержкой, поэтому изображение плавно перегенерируется по мере перемещения ползунков.
  • Паттерн: выберите тип случайного визуального паттерна для генерации. Каждый паттерн создаёт уникальный художественный стиль с использованием случайных форм, цветов и прозрачности.
  • Формат изображения: выберите между PNG (без потерь, больший размер), JPEG (с потерями, меньший размер) или WebP (современный, эффективный). Это влияет как на скачиваемое изображение, так и на вывод Base64.

Сценарии использования

  • Встраивание изображений-заглушек или декоративных изображений непосредственно в HTML или CSS без хостинга отдельных файлов
  • Генерация тестовых изображений для рабочих процессов разработки и QA, требующих разнообразного визуального контента
  • Создание уникального процедурного арта или абстрактных фонов для дизайн-макетов