Skip to main content
iotools.cloudiotools.cloud

Instagram Story Generator

Generate a fake Instagram Story image — segmented progress bar, profile row with verified badge, your photo or a gradient background, a styled text overlay, location and music stickers, and the reply bar — then download it as SVG.

Input

Shown next to the username, e.g. 5m, 2h, 1d. Leave empty to hide it.

Drop an image or browse
One file · image

Optional. Stays in your browser — initials are drawn if you skip it.

Drop an image or browse
One file · image

Optional. The gradient below shows through if you skip it.

The text overlay drawn on top of the story. Leave empty for a photo-only story.

Settings

Fills the screen when there is no photo, and frames a fitted one.

How many segments the progress bar is split into.

Which segment is mid-play. Clamped to the number of stories above.

Optional pill sticker. Leave empty to hide it.

Optional pill sticker under the location. Leave empty to hide it.

The placeholder in the bottom reply pill. Change it to mock another language.

For mockups, memes and parody only. Don't present a generated image as a real Story, and don't use it to impersonate anyone or spread misinformation.

Output

Preview

Your Instagram Story will appear here.

SVG source
Was this helpful?

Guides

Build a realistic fake Instagram Story image in the browser — the segmented progress bar along the top, the profile row with a verified badge and timestamp, your own photo or a gradient background, a styled text overlay, location and music stickers, and the "Send message" reply bar at the bottom. The result downloads as an SVG at a true 9:16 Story ratio, so it stays sharp at any size you drop it into.

Nothing is uploaded. Your profile picture and story photo are read straight into the page and embedded in the SVG, so the whole mockup is produced on your machine.

How to use it

  1. Type the username and, if you want one, tick Verified account.
  2. Optionally upload a profile photo and a story photo. Skip the profile photo and initials are drawn instead; skip the story photo and the gradient shows through.
  3. Write the story text — the overlay drawn on top. Leave it empty for a photo-only story.
  4. Adjust the settings: text style, size, position and alignment, the background gradient, how many stories are in the set and which segment is playing, plus the location and music stickers.
  5. Download the SVG from the output panel, or copy the source.

Settings

  • Text style — Classic (plain white with a soft shadow), Modern (a dark rounded plate behind each line), Neon (a colored glow), Typewriter (monospace) and Strong (heavy uppercase with wide tracking).
  • Photo layout — Full screen crops your photo to fill the 9:16 frame; Fitted shows the whole photo on top of the gradient, which is what you want for a landscape shot.
  • Stories in the set / Segment playing — the progress bar is split into that many segments, with the playing one drawn half-filled and the ones after it dimmed. Real Story screenshots almost always show a set, not a single bar.
  • Location and music stickers — optional pills drawn above the reply bar. Leave either empty to hide it.
  • Reply bar text — the placeholder inside the bottom pill. Change it to mock a Story in another language.

Privacy

Everything runs client-side. Both image uploads are converted to data: URLs in your browser and written directly into the SVG markup — no image is ever sent to a server, and the generated file has no external references, so it renders offline.

Why SVG instead of PNG?

An SVG is resolution independent: the same file looks correct in a slide deck, on a retina screen and in a printed mockup. If you need a raster copy, open the downloaded SVG and export it, or drop it into the SVG to PNG Converter.

Can I use this to fake a real person's Story?

No. This is a mockup tool for design comps, memes, tutorials and parody. Presenting a generated image as a genuine Story — or using it to impersonate someone — is not what it's for.

What if I want a feed post or a DM instead?

Use the Instagram Post Generator for a square feed post with likes and a caption, or the Instagram DM Generator for a direct-message conversation.

instagram storyfake storystory mockupsocial media mockupscreenshot generatorreelsmeme9:16

Use it from code

From 3 credits per call

REST API

curl -X POST https://api.iotools.cloud/v1/tool/instagram-story-generator \
  -H "Authorization: Bearer YOUR_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "username": "alexmorgan",
    "verified": "true",
    "timeAgo": "2h",
    "storyText": "Last light on the coast",
    "textStyle": "classic",
    "textSize": "medium",
    "textPosition": "center",
    "textAlign": "center",
    "background": "purpleOrange",
    "photoFit": "cover",
    "storyCount": "5",
    "activeStory": "2",
    "location": "Nazare, Portugal",
    "music": "",
    "replyPlaceholder": "Send message",
    "showReplyBar": "true",
    "showScrim": "true"
  }'

Swap in your own key from your account. The tool's fields are the body — no wrapper.

Ask an AI agent

Use the IOTools `instagram-story-generator` tool (Instagram Story Generator) on this input:

YOUR_INPUT_HERE

Paste this at any agent connected to the IOTools MCP server, then add your input.

Love the tools? Lose the ads.

One payment clears every ad from your account, for good. No subscription, no tracking.

Remove ads