How to create an Instagram DM mockup in four steps
- Set the account. Type the username into Contact → Name — it renders in the header next to the avatar, the way Instagram shows the handle. Upload an avatar, or let ChatMock draw an Instagram-colour gradient initial circle.
- Write the conversation. Add messages with + Alex or + Me, flip each one between the two sides, and reorder with the arrows. Uploading an image turns that message into a rounded media bubble with an optional caption.
- Set the Seen indicator. Under Contact → Delivery, the label defaults to
Seen. It renders under your last outgoing message with a tiny version of the recipient's avatar — clear the field to show a conversation they have not opened yet. - Export. Pick 1x, 2x or 3x and hit Download PNG. Exports are plain screen captures by default — a real screenshot never includes the phone body. Tick Phone frame only when you want a device-mockup look for a post, thumbnail or slide.
What makes an Instagram DM screenshot actually look real
Instagram DMs are visually simple and unusually easy to get subtly wrong. Here are the values ChatMock uses, taken from the real app:
| Element | Light mode | Dark mode |
|---|---|---|
| Chat background | #ffffff | #000000 |
| Outgoing bubble | Gradient #a033ff → #e24aa2 — not a flat colour | |
| Incoming bubble | #efefef | #262626 |
| Bubble shape | 18px capsules, no tails, no corner narrowing between grouped messages | |
| Seen indicator | Mini avatar + label under the last outgoing message only | |
| Timestamps | Occasional centred markers between groups, never per bubble | |
Two details carry the realism. First, the gradient: outgoing bubbles fade from purple into pink, and that gradient survives in both light and dark mode — a flat blue sender bubble reads as Messenger, not Instagram. Second, the Seen indicator is an avatar, not text alone: a tiny round photo of the recipient appears next to the label under your last message. Text-only Seen lines are the most common tell in fake Instagram screenshots.
Everything you can customise
- Username and avatar photo (header and Seen indicator)
- Light or dark mode, both matching the real app
- Unlimited messages, reorderable, either side
- Seen label text — or remove it entirely
- Image attachments with captions
- Group time marker text
- Status bar: clock, carrier, battery and signal
- Optional iPhone-style phone frame
What people use Instagram DM mockups for
Instagram threads dominate creator-adjacent video: brand-deal sketches, “DMing my favourite artist” formats, UGC course material showing how a collaboration request reads, and fiction that plays out over a creator's inbox. The audience knows the interface intimately, which cuts both ways — the screenshot reads instantly, and small errors read just as fast.
The line, as everywhere on this site, is intent. Illustrating, parodying, teaching and designing are fine. Using a fabricated conversation to deceive someone, harass a person, impersonate a creator or brand, or fabricate evidence is not — and there are no templates here for fake bank, government, medical or legal notices. The Acceptable Use Policy has the full boundary.
Why it runs entirely in your browser
Everything is rendered locally with plain HTML and CSS, and the PNG is generated on your device — nothing is transmitted, stored or logged. That is why the editor keeps working with your wifi switched off, and why there is no database of staged conversations anywhere on our side.
Other generators
ChatMock covers the platforms people actually search for, one at a time: the WhatsApp chat generator, the iPhone text message generator, the group chat generator, the Messenger chat generator, the Discord chat generator and the Telegram chat generator are all live. See the generator index for the full list.
For a deeper walkthrough of the details above, read the full Instagram DM screenshot guide on the blog.
Frequently asked questions
Is this Instagram DM generator free?
Yes — no signup, no email wall, no daily limit and no watermark on the export. Every editing feature, including image messages and dark mode, is free, and PNG export works at 1x, 2x and 3x resolution.
Why is the outgoing bubble a gradient?
Because that is how Instagram renders your own messages. Since the platform unified its chat themes, outgoing DM bubbles use a purple-to-pink gradient rather than a flat colour. Generators that use a plain blue or grey bubble for the sender side do not look like Instagram.
What does the Seen indicator look like?
Under your last outgoing message, Instagram shows a tiny version of the recipient's avatar next to the word Seen. This generator reproduces exactly that — a small round avatar plus the label — and the label text is editable if you want a different state or want to remove it.
Why are there no timestamps next to each message?
Instagram does not label individual messages. Time markers appear occasionally between message groups as small centred grey text. Stamping every bubble is the fastest way to make an Instagram DM screenshot look fake.
Is my conversation uploaded to a server?
No. The mockup is rendered entirely on your device, and the PNG is generated in your browser and saved straight to your downloads. Usernames, messages and uploaded images never leave your computer or phone — you can disconnect from the internet after loading the page and keep working.
What resolution can I export?
1x (390px wide), 2x (780px) or 3x (1170px). For thumbnails and posts, 2x is usually the sweet spot between sharpness and file size. Use 3x when the screenshot will be zoomed into or printed.
Can I use the mockups commercially?
Yes, for legitimate creative work: videos, thumbnails, presentations, teaching material, fiction and design. You may not use them to deceive, defraud, harass, impersonate anyone or fabricate evidence. The Acceptable Use Policy has the full boundary.