Component library

Showing 3 components on instagram · intent case-study.

<InstagramSquarePost>

instagramsquarereleaseproduct-updateblogcase-studyeventmilestonePosts

Convenience layout: Instagram 1:1 post with optional hero image.

When to use: Visual-first announcements and blog promos on Instagram.

Preview

Instagramsquare

New blog

Five inboxes touch every invoice

How finance teams map manual handovers before automating.

Prop	Type	Notes
headline	string	Required. Post headline.
body	ReactNode	Optional. Optional supporting copy.
eyebrow	string	Optional. Optional category label.
mediaSrc	string	Optional. Optional hero image URL.
mediaAlt	string	Optional. Hero image alt text.

Examples

<InstagramSquarePost
  eyebrow="New blog"
  headline="Five inboxes touch every invoice"
  body="How finance teams map manual handovers before automating."
/>

<InstagramPortraitPost>

instagramportraitblogcase-studyeventthought-leadershipPosts

Convenience layout: Instagram 4:5 portrait post.

When to use: Longer copy or stacked headline + image on Instagram.

Preview

Instagramportrait

Case study

Acme cut invoice triage from 38 minutes to 4

Three-way matching between invoices, POs, and goods receipts.

Prop	Type	Notes
headline	string	Required. Post headline.
body	ReactNode	Required. Post body copy.
eyebrow	string	Optional. Optional category label.
mediaSrc	string	Optional. Optional hero image URL.
mediaAlt	string	Optional. Hero image alt text.

Examples

<InstagramPortraitPost
  eyebrow="Case study"
  headline="Acme cut invoice triage from 38 minutes to 4"
  body="Three-way matching between invoices, POs, and goods receipts."
/>

<BlogPromoPost>

instagramsquareportraitblogcase-studyPosts

Finished blog or case-study promo (1080×1080 or 1080×1350).

When to use: Blog launches and article promos on Instagram or LinkedIn.

Preview

New blog

Five inboxes touch every invoice

How finance teams map manual handovers before they automate intake.

Prop	Type	Notes
headline	string	Required. Article headline.
eyebrow	string	Optional. Default: `New blog`. Category label.
body	ReactNode	Optional. Supporting copy.
mediaSrc	string	Optional. Hero image URL.
mediaAlt	string	Optional. Hero alt text.
dimension	"square" \| "portrait"	Optional. Default: `square`. Export aspect ratio.
background	"light" \| "white" \| "dark" \| "brand" \| "vivid"	Optional. Default: `dark`. Canvas background token.

Examples

<BlogPromoPost
  headline="Five inboxes touch every invoice"
  body={<>How finance teams map manual handovers before they automate intake.</>}
/>