Facebook Post Mockup Generator
Fill in the fields, watch the post render live in light or dark mode, and download the image.
Rendered in your browser at twice the on-screen size, so text stays sharp in slides and on Retina displays. Nothing is uploaded.
What a Facebook post mockup is for
A mockup shows what a post will look like in the feed before it exists. Nobody has to publish a draft to a live page, screenshot it and delete it, and nobody's real profile appears in the picture.
- Client approvals. Agencies and freelancers send the week's posts as images that look like the real thing. A caption in a spreadsheet gets a different reaction than the same caption under a round avatar with a blue Like button.
- Ad proofs. Check how a headline wraps at 500 px, whether the photo crops badly, and where the “See more” cut lands before the budget goes live.
- Tutorials and documentation. Help articles, courses and slide decks need a clean post without a real person's name in it. Set the name to “Your Page” and export.
- Memes and parody. Fictional characters and obvious jokes are fine; the label option exists so the joke stays a joke (see the note below).
- Copy testing. Build three versions of the same post in a minute and compare them side by side.
How to use the generator
- Type the name and upload a profile photo. Without one, the tool draws an initials circle in a colour derived from the name, the same fallback Facebook uses for accounts without a picture.
- Set the time and audience. Facebook shows relative times (“2h”, “Yesterday at 09:41”) and one of three icons: a globe for Public, two people for Friends, a padlock for Only me.
- Paste the text. Line breaks and emoji are kept. Anything longer than five lines collapses behind “See more”, exactly as in the feed; click it to show the whole post in the export.
- Add a photo if the post has one. It fills the card's width and is capped at 500 px tall, the way a single-image post renders on desktop.
- Enter reactions, comments and shares. Numbers above 999 are shortened to “1.2K” and “3.4M” like the real counters. A zero hides the row item.
- Pick light or dark and 500 or 375 px, then download. The PNG is rendered at 2× resolution with a transparent background, so it drops onto any slide or document.
Details that make a mockup look like the 2026 feed
Facebook's desktop post card is 500 px wide with 16 px side padding, a 40 px round avatar, a 15 px semibold name and a 13 px grey meta line. Body text is 15 px on a 20 px line, dark grey (#050505) on white or light grey (#E4E6EB) on #242526 in dark mode. Reactions sit on the left as overlapping 18 px circles in the order like, love, care; comment and share counts sit on the right. The action bar has three equal buttons separated from the counts by a 1 px divider.
The preview here follows those numbers and uses the same system font stack Facebook loads (Segoe UI on Windows, San Francisco on Apple devices, Roboto on Android), so the export matches what your audience sees on their own machine. If you need a screenshot of the post inside a whole page, place the PNG over a browser frame; for a phone, use the 375 px width.
A note on fake posts
This tool makes pictures, not posts. Nothing is published, nothing is linked to a real account, and Facebook is not involved. That also means a mockup can be mistaken for a real screenshot, which is why the small “mockup” label is on by default. Leave it on for anything that leaves your desk unless there is a good reason to remove it.
Putting words into the mouth of a real person or company, and presenting the result as genuine, can be defamation or fraud in most countries and violates Meta's terms as well as the rules of every platform you might share it on. Parody is protected in many places, but only when a reasonable viewer can tell it is parody, so label it. Use the generator for people who agreed to it, for fictional names, or for your own pages.
