Why is my answer in a bubble?

It shouldn't be — check who the message is from. In this format, messages marked as yours render as the grey user bubble on the right, and everything else renders full-width as the assistant. If your answer is bubbled, it is set as one of yours.

Can I include a code block?

Write the code with line breaks and it holds its shape in the answer. There is no syntax highlighting — a highlighted block would have to guess a language, and guessing wrong looks worse than plain monospace.

How do I get the dark version?

The Dark toggle in the studio header switches the scene, not the site. Most ChatGPT screenshots people share are dark, so it is worth trying both before you export.

Can I make it say something it would never say?

You can type anything into the editor — it is a text field, not a model. But presenting an invented answer as something a real product actually produced is misrepresentation, and our terms prohibit it. Screenshots of AI saying alarming things travel a very long way and are almost never corrected.

Does anything here call a real model?

No. Nothing on this site talks to any AI service. Every word in the preview is one you typed or one that came from an example — the rendering is entirely local to your browser.

Does it do Claude, Gemini, Grok and Perplexity too?

Yes, and each is built from its own interface rather than recoloured. Claude's page is cream and names the model in the header; Gemini uses Material 3 and the blue-to-magenta sparkle; Grok is monochrome; Perplexity puts numbered source chips above every answer.

Can I export a long conversation?

Yes. The download dialog offers the whole conversation at its true height, exactly one screen, or fit-to-content — so a four-turn session with a long answer comes out complete rather than cropped.

Is there a watermark?

Free downloads carry a small SIMULATED · socialmock.com label at 1× resolution; Pro removes it and unlocks 2× and 3×. You can also switch the label on yourself, and for AI screenshots it is worth considering — they are among the most-shared and least-checked images there are.

ChatGPT mockups

Fake ChatGPT chat & screenshot generator

Build a ChatGPT screenshot with the layout that identifies it — your message in a grey bubble on the right, the answer running full-width on the left behind the sparkle, and a composer that ends in an up-arrow rather than a paper plane.

Open the ChatGPT editorFree · no account · PNG and video

Start from a ChatGPT example

Each one opens in the editor as an editable, fictional scene — names, timings and interface details already set. Change a word, or change everything.

All examples

9:41

Make this less blunt without making it grovel: "No. The deadline moved twice already and I'm not moving it again."

Here's a version that holds the line but leaves the relationship intact: "I'd rather not move this one again — we've shifted it twice and each move costs us more than the delay saves. If the date genuinely can't work, tell me what's driving it and I'll look at scope instead." It keeps the no, gives a reason that isn't personal, and offers a different lever. Want a shorter version?

shorter

"We've moved this twice and I'd rather not again. If the date is a real problem, let's talk about scope instead."

ChatGPTWork

Make this email less blunt

The most common thing anyone asks an assistant to do, and the one people actually screenshot.

Use this template

9:41

half an onion, two eggs, rice from yesterday, soy sauce, one spring onion that has seen things

Egg fried rice, and the day-old rice is the reason it'll be good — fresh rice steams instead of frying. Hot pan, oil, onion until it's translucent. Push it aside, scramble the eggs in the space, then break them up. Rice in, break up the clumps with the back of the spoon, leave it alone for a minute so it catches. Soy at the end, off the heat. Spring onion on top, green parts only. The one that matters: don't stir constantly. The catching is the point.

the spring onion did not survive but this was excellent

ChatGPTSupport

What can I make with this?

Three things and half an onion. The everyday use nobody writes case studies about.

Use this template

9:41

TypeError: Failed to fetch — only in production, works locally. The URL is a data: URL.

That combination almost always means a Content-Security-Policy. `fetch()` on a `data:` URL is governed by `connect-src`, and a data: scheme won't match an allow-list unless you put it there explicitly. Locally you probably have no CSP header at all, which is why it only breaks in production. Two options: 1. Add `data:` to `connect-src` — fixes it, but hands every script on the page a new fetch target. 2. Don't fetch it. A data: URL is already bytes in memory: decode the base64 yourself into a Blob. I'd take option 2.

that was it. it's been broken for a week and there was no error message anyone could act on

ChatGPTWork

Debugging at 1am

A stack trace, a hypothesis and the actual cause. Written the way a real session goes rather than as one perfect answer.

Use this template

How to make a ChatGPT mockup

Start from an example
The three above are what people actually make: rewriting a blunt email, debugging at 1am, and working out dinner from what is in the fridge.
Write your side
Each message marked as yours becomes a grey bubble on the right. Keep them short — real prompts usually are, and the contrast with the long answer is part of what makes it read correctly.
Write the answer
Everything not marked as yours renders full-width as the assistant. Use paragraphs and lists; line breaks hold. An answer that is one line looks like a text message.
Add the follow-up
Three or four turns beats one question. A short follow-up and a short reply is what turns a demo into a session.
Export
PNG at 1× free, up to 3× on Pro, light or dark, the whole conversation or one screen, with or without the phone frame.

How the ChatGPT interface is put together

Our ChatGPT skin is rebuilt from the real interface in code rather than traced from a screenshot, so the details that make it recognisable survive at export resolution. Here is what those details actually are.

It is not a two-sided chat

This is the thing that separates an assistant screenshot from a messenger one, and most fakes miss it. Your message sits in a contained grey bubble on the right; the answer is not in a bubble at all — it runs the full width of the screen behind a small mark. There are not two people here, there is a person and a system, and the layout says so.

Answers are prose, not chat

A ChatGPT reply has paragraphs, sometimes a numbered list, sometimes a code block — and it is long. A mockup with a one-line answer in a bubble looks like a text message. Line breaks and lists hold here, so an answer can be the shape an answer actually is.

The sparkle, and nothing else

One small mark beside each answer. No avatar, no name, no timestamp on the reply. ChatGPT's interface is unusually bare, and reproducing that restraint is harder than adding decoration — the temptation is always to put something in the empty space.

The composer is a rounded field with an up-arrow

Plus on the left, microphone and voice on the right, and the send control is an arrow pointing up in a filled circle — not a paper plane. Getting the send glyph wrong is one of the fastest tells, because it is the thing your eye lands on last.

Dark mode is the default people screenshot

Most ChatGPT screenshots in the wild are dark, because that is what the app opens in for a lot of people. The debugging example above is dark for exactly that reason. Both themes are here — the toggle is in the studio header.

The conversation continues

The screenshots people share are usually three or four turns, not one question. A follow-up — “shorter”, “that was it” — is what makes it read as a session rather than a demo, and each turn is its own message in the editor.

What people use ChatGPT mockups for

Tutorials, courses and how-to content
Memes and reaction posts
Product demos and pitch decks
Prompt-engineering write-ups
AI-literacy and critical-thinking teaching
Fiction, scripts and storyboards

Questions about ChatGPT mockups

Why is my answer in a bubble?: It shouldn't be — check who the message is from. In this format, messages marked as yours render as the grey user bubble on the right, and everything else renders full-width as the assistant. If your answer is bubbled, it is set as one of yours.
Can I include a code block?: Write the code with line breaks and it holds its shape in the answer. There is no syntax highlighting — a highlighted block would have to guess a language, and guessing wrong looks worse than plain monospace.
How do I get the dark version?: The Dark toggle in the studio header switches the scene, not the site. Most ChatGPT screenshots people share are dark, so it is worth trying both before you export.
Can I make it say something it would never say?: You can type anything into the editor — it is a text field, not a model. But presenting an invented answer as something a real product actually produced is misrepresentation, and our terms prohibit it. Screenshots of AI saying alarming things travel a very long way and are almost never corrected.
Does anything here call a real model?: No. Nothing on this site talks to any AI service. Every word in the preview is one you typed or one that came from an example — the rendering is entirely local to your browser.
Does it do Claude, Gemini, Grok and Perplexity too?: Yes, and each is built from its own interface rather than recoloured. Claude's page is cream and names the model in the header; Gemini uses Material 3 and the blue-to-magenta sparkle; Grok is monochrome; Perplexity puts numbered source chips above every answer.
Can I export a long conversation?: Yes. The download dialog offers the whole conversation at its true height, exactly one screen, or fit-to-content — so a four-turn session with a long answer comes out complete rather than cropped.
Is there a watermark?: Free downloads carry a small SIMULATED · socialmock.com label at 1× resolution; Pro removes it and unlocks 2× and 3×. You can also switch the label on yourself, and for AI screenshots it is worth considering — they are among the most-shared and least-checked images there are.

Use these responsibly

Everything made here is simulated. SocialMock has no connection to ChatGPT and cannot read, send or alter a real message. Do not use a mockup to impersonate anyone, pass it off as a genuine screenshot, or present it as evidence in any legal, workplace or academic matter — see our Acceptable Use policy. For general information about legal risk, read is it legal to fake a screenshot? If you publish somewhere a viewer might mistake it for real, switch on the “Simulated” label before exporting.

Related generators

Claude generator Gemini generator Grok generator Perplexity generator WhatsApp generator iMessage generator Instagram DM generator Messenger generator

Browse all 36 apps

Build your ChatGPT mockup now

Click straight into the preview and type. Export when you are done — free at 1×, up to 3× on Pro.

Open the ChatGPT editor

Fake ChatGPT chat & screenshot generator

Start from a ChatGPT example

Make this email less blunt

What can I make with this?

Debugging at 1am

How to make a ChatGPT mockup

Start from an example

Write your side

Write the answer

Add the follow-up

Export

How the ChatGPT interface is put together

It is not a two-sided chat

Answers are prose, not chat

The sparkle, and nothing else

The composer is a rounded field with an up-arrow

Dark mode is the default people screenshot

The conversation continues

What people use ChatGPT mockups for

Questions about ChatGPT mockups

Use these responsibly

Related generators

Build your ChatGPT mockup now