How to create a Snapchat chat mockup in four steps
- Set the contact. Type the name into Contact → Name — it renders in the yellow header. Upload an avatar, or let ChatMock draw a yellow initial circle that reads like a Bitmoji placeholder.
- Write the conversation. Add messages with + Emma 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 a caption.
- Set the Delivered label. Under Contact → Delivery, the label defaults to
Delivered. It appears under your outgoing messages in small grey text — clear it or replace it if your scene needs a different state. - 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 thumbnail, post or slide.
What makes a Snapchat screenshot actually look real
Snapchat is the platform generators get wrong most often, because its colour logic is backwards from what people assume. Here are the values ChatMock uses, taken from the real app:
| Element | Light mode | Dark mode |
|---|---|---|
| Header bar | #fffc00 — yellow, with black text and icons, in both modes | |
| Chat area | #ffffff — white, not yellow | #000000 |
| Outgoing bubble | Lavender #d9a7f9 | Deep purple #5b3a8e |
| Incoming bubble | #f0f0f0 | #262626 |
| Delivered label | Small grey text under outgoing messages | |
| Timestamps | Never inside bubbles | |
The single biggest tell in fake Snapchat screenshots is an all-yellow screen. Real Snapchat chats have a yellow header over a white (or black) conversation area, and generators that fill the whole screen with #fffc00 are instantly recognisable. The second tell is the outgoing bubble colour: it is lavender, not yellow, not blue, and not grey. And third, the Delivered label sits under outgoing messages as plain grey text — a detail most generators omit entirely.
Everything you can customise
- Contact name (in the yellow header) and avatar photo
- Light or dark mode, both matching the real app
- Unlimited messages, reorderable, either side
- Delivered label text — or remove it entirely
- Image attachments with captions
- Date marker at the top of the thread
- Status bar: clock, carrier, battery and signal
- Optional iPhone-style phone frame
What people use Snapchat mockups for
Snapchat conversations show up constantly in storytime videos, teen-drama sketches, and social media safety tutorials — the platform's ephemerality makes “here is what the message said” the natural visual device. Teachers and awareness campaigns use it for the same reason. Because the interface is so colour-distinct, audiences recognise it at thumbnail size, which is also why the yellow/white split matters: getting it wrong undermines the whole frame.
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 someone 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, the Telegram chat generator and the Instagram DM generator are all live. See the generator index for the full list.
Frequently asked questions
Is the whole Snapchat chat screen yellow?
No — and this is the most common mistake in fake Snapchat screenshots. The signature yellow (#fffc00) appears in the header bar and the app's main screens, but the conversation area itself is white in light mode and pure black in dark mode. This generator gets that split right.
Is this Snapchat chat generator free?
Yes — every feature is free, with no signup, no email wall, no daily limit and no watermark on your export. PNG download works at 1x, 2x and 3x resolution.
Why does Delivered appear under my messages?
Snapchat shows a small grey Delivered label under outgoing messages once they reach the recipient's device — it is part of the interface, not an extra. The label is editable in the editor, so you can remove it or replace it for specific scenes.
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 directly 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 add images inside the chat?
Yes. Any message can carry an image attachment with a caption. Uploaded images are read locally in your browser and rendered as rounded media bubbles.
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.