⚠️ Design system CSS not found. Check the path in cms/docs.config.js → designSystemPath, then re-run npm run docgen.

Instagram

The grid is a portfolio. Every post is a brand exhibit

Touchpoints / Instagram
Download .md file
Open .md in new tab

Instagram is the brand's most visual channel. The grid reads as a portfolio before anyone opens a single post. The studio team owns it.

Identity here

  • Logo: the avatar variant carries the profile photo; it has to survive a circular crop at thumbnail size. Variants and clear space: 4.1 Logo.
  • Colour: imagery and graphics stay inside the brand palette; no per-post filters or off-palette gradients. Accents: 4.2 Colour.
  • Type: where text is designed into a post, Story, or Reel cover rather than shot in-camera, it uses the brand type roles, not the platform's sticker fonts: 4.3 Typography.

Formats

Each format's spec sits above its template. Sized blanks (with the safe areas and grid crop marked) are requested from design; a download opens once the template lands. Instagram publishes no exact safe-area or file-size figures, so the margins below are working values, not platform guarantees. The one that catches people: the profile grid crops every post preview to 3:4, so a composition has to hold with the top and bottom of a 4:5, or the sides of a landscape, shaved off.

Profile photo

1080×1080 · 1:1 · JPG/PNG. Displayed in a circular crop at about 320×320; centre the mark and upload large so it stays sharp on retina. This is the avatar logo variant, taken from the logo kit rather than downloaded as a template here.

Profile photo, 1080×1080

Portrait post

4:5 · JPG/PNG. The default feed export and the tallest ratio the feed shows. The grid preview crops to 3:4, so hold the composition centred.

Portrait post, 1080×1350

Square post

1:1 · JPG/PNG. The grid preview crops to 3:4.

Square post, 1080×1080

Landscape post

1.91:1 · JPG/PNG. The grid preview crops to 3:4.

Landscape post, 1080×566

Story

9:16 · JPG/PNG or MP4. Keep roughly 250px clear top and bottom; the profile info and reply bar overlay the frame.

Story, 1080×1920

Reel cover

9:16 · MP4 with a JPG or PNG cover. Keep the top ~250px and bottom third clear; the caption, username, and action rail overlay the frame, and the cover crops to 3:4 in the grid.

Reel cover, 1080×1920

Specs verified against platform documentation: 2026-07-05.

Don't

Don't put text in the overlay zones

The top and bottom of a Story or Reel belong to the platform UI. Text there sits under the username, caption, or reply bar.

Don't compose for the full 4:5

The grid crops every preview to 3:4. A composition that only works at full height falls apart on the profile, where first impressions happen.

Don't drift off the palette

Platform filters and sticker colours read as someone else's brand. Designed assets use the brand palette; photography stays true to its grade.

Voice here

Captions carry the same voice as everywhere else. The platform changes the length, not the register. Lead with the point: the first line is all most people see before "more". The cheat sheet: 3.3 How We Communicate.

Tools

  • Image Placeholder, draft-stage imagery at exact post and Story dimensions

Checklist

  • Exported at spec size for the placement, no platform-side upscaling
  • Composition holds inside the 3:4 grid crop
  • Stories/Reels text clear of the overlay zones
  • Colour and type from the brand system; avatar logo variant on the profile
  • Caption passes the voice check, point first
On this page
  • Identity here
  • Formats
  • Don't
  • Voice here
  • Tools
  • Checklist
Previous

Email Signature

Next

LinkedIn

Was this page helpful?

We use this feedback to improve our documentation.

Thanks for your feedback

Send feedback

© 2026 By Default