Logo

MonoCalc

/

Instagram Post Mockup Generator

Social Media
This tool does not fetch real posts
You type the content and pick your own image; we draw the post in your browser. There is no field for a post link: this site is a static export with no server, so there is nothing here that could hold an API token or read an Instagram page. Nothing you enter, and neither image you choose, ever leaves your device.

Every export carries the strip “Mockup — not a real post · monocalc.com” below the post. There is no setting to remove it.

Icons and badges are generic placeholders, not official brand assets. Emoji are painted by your system’s emoji font, so on a platform without colour emoji they come out monochrome.

Account

Type it with or without the @; the header draws it without one. Letters, digits, dots and underscores. No length limit is enforced, because Instagram’s published figure could not be read from its help page when this tool was built, and a warning based on a guess would fire on valid handles.
The small line under the username. Leave it blank to hide it.

A rosette with a check that we draw. It is not Instagram’s badge artwork, and nothing is claimed here about how verification is granted.

With none chosen, a neutral grey silhouette is drawn.

A local file only. It is decoded in your browser, circle-cropped, and never uploaded.

Post image

With none chosen, a placeholder frame is drawn and the download still works. JPEG, PNG, WebP or GIF, up to 25MB and 50 megapixels.

A local file only — images by web address are not accepted, because drawing a cross-origin image taints the canvas and breaks the PNG export outright.
The frame shape. Only the ratio is shown: no upload size for this placement has been read from Instagram’s own documentation, and this tool does not print a pixel figure it cannot cite.

Horizontal

Vertical

Choose an image to see what the crop keeps.

The image is cover-cropped into the frame. These move the part that is kept; the thumbnail shows what is being cut off.
1 to 10. Dots are drawn only above 1. This range is a cap this tool sets, not a limit Instagram publishes.
Which dot is filled in.

Engagement and caption

Whole numbers, drawn exactly as you set them. Leave one blank and that line disappears; 0 is not blank and draws as 0 likes. Nothing here estimates reach, engagement or how a post would perform.

139 visible characters, counted as grapheme clusters so an emoji family counts once. No limit is shown: Instagram’s published caption length could not be read from its help page when this tool was built, and a figure copied from elsewhere would only look checked. Hashtags, mentions and links are drawn in the accent colour — as text only, never as links.
Collapsing shows two lines and a muted “… more”, the way a caption appears in the feed. It is a drawing choice — your caption itself is never edited.
Nothing is computed from the current time, so the mockup means the same thing tomorrow.
Drawn exactly as you type it, in small capitals-sized text.

Appearance and export

The post's own width in CSS pixels, before the export scale.
Multiplied by your screen's pixel density, which is why the exact export size is printed under the preview.
Transparent leaves the area around the post empty; the caption strip is still drawn, on a solid pill so it stays legible on any background.
A mockup, not evidence
Use this for slides, documentation, design comps and blog figures. Fabricating a post attributed to a real person in a format built to look authentic is not a design exercise, and the caption strip does not make it one. Use a username you own or an obvious placeholder.

About This Tool

Instagram Post Mockup Generator — a feed post you draw, not one you capture

A pitch deck about a campaign needs an example post long before the campaign exists. A blog figure about caption writing wants the same photo with three different captions side by side. A client preview wants to show how a shot will sit in the feed without publishing anything, and a teaching slide wants a post that will still make its point next year. This Instagram post mockup generator draws that in-feed post from fields you fill in and hands you a PNG.

This tool does not fetch real posts
You type the content and pick your own image; we draw the post in your browser. There is no field for a post link, because there is nothing behind this page that could load one.

Why there is no “paste a post link” box

The name suggests pasting a URL and getting a picture back, so it is worth being precise about why that is not on offer. This site is a static export: there is no server, no route handler and nowhere to keep a secret. The Instagram Graph API needs an access token and a linked business or creator account, and a token inside a shipped bundle is a token anybody can read. Fetching an instagram.com/p/<shortcode>/ page straight from your browser is refused by the same-origin policy. A third-party CORS proxy would work until it stopped, and would see every link you looked up. So the input is your own text and your own image — which makes a better figure anyway, since it still says what you meant a year from now.

The canvas is the preview

Many tools of this kind build the post out of HTML and then photograph it with a screenshot library, which leaves two renderers that slowly disagree: the download gets a different font, a shifted baseline, a missing shadow. Here the post is painted directly onto a single canvas, and that same canvas is both what you see and what gets encoded. Line breaks are decided by measuring each candidate with the browser’s own font metrics, and break opportunities come from Intl.Segmenter, so an emoji family, a skin-tone sequence or a Devanagari cluster is never cut down the middle. Right-to-left captions are handed to the canvas to lay out rather than reversed by hand.

What you control

The header takes a username, an optional location line, an avatar and a generic verified badge. The image frame comes in square, portrait and landscape shapes, and because a cover crop quietly throws away part of a photo, two focal sliders move the region that is kept while a thumbnail shows you exactly what is being cut off. Carousel dots appear once you set more than one slide. Likes and comments are drawn as you type them — 1,234 likes in full, larger counts abbreviated — and a blank field hides that line entirely, while 0 draws as 0 likes. The caption runs on from the bold username as one flow, with hashtags, mentions and links picked out in the accent colour as drawn text, never as anything clickable. Collapsing it to two lines and a muted … more is a drawing choice; your caption itself is never edited.

Timestamps that do not drift

You either type the label yourself or pick a date rendered through a locale you pin, so a colleague’s machine produces the same string. Nothing is computed from the current time. A mockup whose meaning changes overnight is a mockup you cannot check into a repository or put in front of a client twice.

Your images stay on your device

The avatar and the post image are local files only. Your browser decodes them in memory, honours their EXIF orientation so a phone photo is not drawn sideways, and paints them onto the canvas. Nothing is uploaded, and the object URLs are released as soon as you swap an image out. Images by web address are not accepted at all: besides the privacy question, drawing a cross-origin image taints the canvas and breaks the export outright. The tool makes no network request of any kind, which you can confirm by using it with the connection switched off.

What this tool will not tell you

No number here describes somebody else’s product unless it could be read from that platform’s own documentation and dated. Instagram’s help pages were not reachable when this tool was built, so you will not find a caption character limit, a username length rule or a published upload size printed as fact — the tool shows your caption’s length and the frame’s ratio instead, and says plainly which figures are its own. It also estimates nothing about performance: no reach, no engagement rate, no posting-time advice. A post you typed cannot tell you how a real one would do.

Where the line is

Every export carries a strip below the post reading Mockup — not a real post, and there is no toggle, opacity slider or crop control that removes it. It sits outside the post frame so your comp still looks right in a slide while staying honest about what it is. Use this for design comps, decks, blog figures, client previews and teaching material. Do not use it to fabricate a post attributed to a real person: putting words and a photo in someone’s feed in a format built to look authentic is defamation with a nicer font, and a caption strip does not make it acceptable. For the same reason no Instagram or Meta wordmark, camera glyph or official badge is shipped — every icon here is a plain vector path drawn by the tool.

Frequently Asked Questions

Is the Instagram Post Mockup Generator free?

Yes, Instagram Post Mockup Generator is totally free :)

Can I use the Instagram Post Mockup Generator offline?

Yes, you can install the webapp as PWA.

Is it safe to use Instagram Post Mockup Generator?

Yes, any data related to Instagram Post Mockup Generator only stored in your browser (if storage required). You can simply clear browser cache to clear all the stored data. We do not store any data on server.

Can I paste an Instagram post link and get a picture of it?

No, and there is deliberately no field for one. This site is a set of static files with no server, so there is nowhere to keep the access token the Instagram Graph API requires, and reading an instagram.com post page straight from your browser is refused by the same-origin policy. A third-party proxy would work until it stopped, and would see every link you looked up. So the tool draws only content you type and an image you choose yourself.

How does the generator work?

Every field you fill in is painted onto a single HTML canvas in your browser, and that same canvas is both the preview on screen and the file that downloads — there is no second renderer, so the PNG matches the preview exactly. Lines are broken by measuring each candidate with the browser's own font metrics and finding break points with Intl.Segmenter, so emoji families, Hindi clusters and Japanese text never split in the middle of a character.

Why does every export say “Mockup — not a real post”?

Because a post drawn here is hard to tell from a screenshot of a real one at a glance, and that makes it easy to misuse. The strip is painted below the post on every export and there is no setting, slider or crop control that removes it. It sits outside the post frame rather than on top of the design, so your comp still looks right in a slide while staying honest about what it is.

Do my avatar and post image get uploaded anywhere?

No. Both are local files your browser decodes in memory and draws onto the canvas. Nothing is uploaded, stored or sent anywhere, and the tool makes no network request at all — you can switch off your connection and every part of it still works. Images by URL are not accepted, partly for privacy and partly because drawing a cross-origin image taints the canvas and breaks the PNG export outright.

Are the icons and the verified badge the real Instagram ones?

No. Every glyph — the heart, speech bubble, paper plane, bookmark, menu dots and carousel dots — is a plain vector path drawn by this tool, and the verified badge is a generic rosette with a check in it. No Instagram or Meta wordmark, camera glyph or official badge artwork is shipped, because reproducing those would be using somebody else's trademark. They are placeholders that read as “a mark goes here”.

Why does the tool not show a caption character limit?

Because it could not be verified. The rule in this project is that a number describing somebody else's product ships only with the page it was read from and the date it was read, and Instagram's help pages were not reachable when this tool was built. Rather than repeat a figure from third-party articles and dress it up with a source link, the tool shows your caption's length in visible characters and leaves the verdict out. The same applies to the username length and the carousel maximum, which is a limit this tool sets rather than one Instagram publishes.