Генератор изображений-заглушек
Создавайте изображение-заглушку в виде масштабируемого SVG — фон сплошным цветом или градиентом, по центру размеры или ваш текст, а также необязательная рамка.
Ввод
Фон
Текст
Рамка
Вывод
Здесь появится ваше изображение-заглушка.
Другие способы использовать этот инструмент
REST API
curl -X POST https://api.iotools.cloud/v1/tool/image-placeholder-generator \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"width": "800",
"height": "600",
"bgType": "solid",
"bgColor": "#cccccc",
"gradientStart": "#667eea",
"gradientEnd": "#764ba2",
"gradientAngle": "135",
"customText": "",
"text": "",
"textColor": "#666666",
"fontSize": "48",
"showBorder": "",
"borderColor": "#999999",
"borderWidth": "4"
}'Подставьте свой собственный ключ из аккаунта. Поля инструмента — это тело запроса, без обёртки.
Спросите у ИИ-агента
Use the IOTools `image-placeholder-generator` tool (Image Placeholder Generator) on this input:
YOUR_INPUT_HEREВставьте это любому агенту, подключённому к MCP-серверу IOTools, и добавьте свой ввод.
Виджет для встраивания
<iframe
src="https://iotools.cloud/embed/image-placeholder-generator/"
width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
title="Генератор изображений-заглушек — iotools.cloud"
sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
allow="clipboard-write"
style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>Вставьте это на свою страницу — бесплатно, без ключа, нужна лишь обратная ссылка.
| Стоимость вызова API/MCP | От 5 кредитов |
|---|---|
| Нужно больше кредитов? | Посмотреть тарифы |
Также доступно через
Руководства
Что делает этот инструмент
Он создаёт изображение-заглушку — фон сплошным цветом или градиентом с подписью по центру — в формате SVG, который можно сразу использовать в макете, каркасе, записи CMS или теге <img>, пока настоящий файл ещё не готов. По умолчанию подпись показывает собственные размеры изображения (800 × 600), так что страница, полная заглушек, сразу показывает, какой блок какого размера. Поскольку результат — это SVG, а не растровое изображение, он остаётся чётким при любом масштабе, а файл весит всего несколько сотен байт для блока однотонного цвета, сколько бы ни была задана ширина и высота.
Как пользоваться
- Укажите ширину и высоту в пикселях (до 4000 px каждая).
- Выберите фон: однотонный цвет или линейный градиент с собственными начальным цветом, конечным цветом и углом.
- Оставьте текст с размерами по умолчанию или включите свой текст и введите любую подпись (название клиента, «Главное изображение», «Скоро» — что угодно).
- Настройте цвет текста и размер шрифта, при необходимости включите рамку с её цветом и толщиной.
- Скопируйте исходный код SVG или скачайте его как файл
.svg— предпросмотр обновляется при любом изменении настроек.
Почему SVG, а не PNG или JPG?
Задача заглушки — сохранить форму и размер блока до того, как придёт настоящий контент, и SVG справляется с этим лучше любого растрового изображения: он одинаково чёткий при ширине 100 px и 10 000 px, занимает считаные байты, его можно вставить как обычную разметку прямо в HTML/CSS без хостинга файла, а большинство инструментов, работающих с изображениями — браузеры, дизайнерские программы, генераторы статичных сайтов, — поддерживают SVG без дополнительных настроек. Если вам нужен именно растровый файл, загрузите скачанный SVG в любой графический редактор или выполните преобразование через <img> и canvas, а затем экспортируйте результат; в любом случае источником истины остаётся SVG.
Можно ли использовать это в реальной вёрстке, а не только в макетах?
Да: укажите <img src="placeholder.svg"> на скачанный файл или вставьте разметку SVG прямо в HTML. Изображение ведёт себя как любое другое: масштабируется через width/height или CSS, а браузер кэширует его как обычный статичный ресурс. Так как у него нет внешних зависимостей (нет стороннего сервиса-заглушки, который может упасть или ограничить количество запросов), его можно безопасно использовать и в продакшене как запасной вариант, а не только в локальной разработке.
Мои данные конфиденциальны?
Да. Всё происходит в вашем браузере: SVG формируется локально по выбранным настройкам, без загрузки, без учётной записи и без обращения к серверу. Ничего из введённого вами, включая свой текст, не покидает ваше устройство.
Текст подгоняется под размер блока автоматически?
Нет — размер шрифта задаётся вами напрямую, автоматической подгонки нет. Если у маленькой или узкой заглушки очень длинный текст, уменьшите размер шрифта, пока он не станет легко читаемым. Для подписи по умолчанию 800 × 600 количество цифр обычно невелико, поэтому стандартный размер 48 px хорошо помещается на любом изображении, которое больше маленькой миниатюры.