Recipe Story - Five Steps Template

A recipe story template for food creators who want their Instagram Story to read like a recipe card. The demo is a "Ten-minute shakshuka" from Olive & Ash, a fictional food newsletter, told in five vertical panes: ingredients, spices, tomatoes, eggs, and the finished pan. Each pane gets a big terracotta step number, one short Fraunces headline, a one-line timing note, and a top-down photo of a black cast-iron pan on cream linen. The whole recipe reel runs 15 seconds.

#What Makes This Template Stand Out

It is a recipe cut down to what fits in a thumb-scroll. Pane one names the dish and lists the essentials as tape-style chips - "6 EGGS", "1 CAN TOMATOES", "CUMIN, PAPRIKA". Panes two to four are single instructions with a timing that matters: "Toast the spices." with "60 seconds, no more.", "Add the tomatoes." with "Simmer 5 minutes.", "Crack the eggs in." with "Lid on, 4 minutes." Pane five, "Bread. Herbs. Eat.", brings the ingredient chips back small and adds a "Full recipe →" pill, so the story ends on the action rather than the photo.

The design borrows from printed cookbooks. A cream #f8f1e6 background, deep brown type, and terracotta #c9552a for the step numbers and the CTA, with a tan tape color behind the ingredient chips. Headlines use Fraunces, a warm serif with soft curves; the numerals are heavy Inter Tight; the "OLIVE & ASH · 10 MIN" chip and ingredient labels are Space Mono. The photos share one angle, one pan, and one linen cloth, which is what makes five separate shots feel like one sequence.

Motion stays calm. Each photo rises in from the bottom and slowly zooms while the step is on screen, the step number letter-fades in, the timing note counts its number up, and the ingredient chips pop in one after another. The brand chip holds still at the top of every pane as the anchor.

  • One step per pane with a big "0N / 05" step counter that animates on every pane
  • Ingredient tape chips on the cover that return on the final pane
  • Timing notes with rolling numbers - 60 seconds, 5 minutes, 4 minutes
  • Top-down food photos in rounded frames that rise from the bottom and slowly zoom
  • Cookbook palette - cream, deep brown, terracotta - with Fraunces headlines
  • 5 panes at 1080x1920, loop on, exactly 15 seconds as an MP4 recipe reel

#Who Should Use This Template

  • Food creators and recipe bloggers who want every recipe to post as a matching story without re-editing a video each time.
  • Cafes and restaurants sharing a signature dish, a seasonal special, or a behind-the-counter method.
  • Food and drink brands showing a product in a real recipe - the ingredient chips are a natural spot for your product name.
  • Food newsletters and cookbook authors using stories to send readers to the full recipe.

#Best Use Cases

#Recipe Reel for Instagram and TikTok

Export the MP4 and post it as a Story, then post the same file as a Reel or TikTok with the full ingredient list in the caption. At 15 seconds the reel is short enough that people watch it twice, and the recurring step counter tells them exactly where they are the second time through.

Publish the story as a hosted PaneFlow link and put it in your bio as "today's recipe". It plays full-screen on phones, and the "Full recipe →" pill on the last pane links out to your blog post, newsletter, or shop.

#Recipe Page Header on Mobile

Embed the vertical story at the top of the recipe on your blog, or export it to HTML, React, Vue, Svelte, or Next.js. Readers who scroll past the photos get the five-step summary before the long-form method, which is often all they need on the first visit.

#How to Customize This Template

  1. Open PaneFlow and choose "Recipe Story - Five Steps" from the template gallery
  2. Change "OLIVE & ASH · 10 MIN" in the top chip to your brand and total cook time
  3. Replace "Ten-minute shakshuka" and the three chips - "6 eggs", "1 can tomatoes", "cumin, paprika" - with your dish and key ingredients
  4. Rewrite "Toast the spices." and "60 seconds, no more." on step 02
  5. Rewrite "Add the tomatoes." / "Simmer 5 minutes." and "Crack the eggs in." / "Lid on, 4 minutes." on steps 03 and 04
  6. Swap all five photos for your own top-down shots, keeping the same angle throughout
  7. Edit "Bread. Herbs. Eat.", update the returning chips, and link the "Full recipe →" pill to your recipe page
  8. Preview the 15-second loop, then export to MP4 or publish as a hosted link

Start with Recipe Story - Five Steps

Open this template in PaneFlow, customize it to match your brand, and export as HTML, React, Vue, or video.