5d:I[333483,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/15s1ft4k9lx-7.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/3ohf-5_4hfjuq.js","/creators-assets/_next/static/immutable/chunks/2jjhfe7-w6y9a.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/0kisxyo3aw231.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/2y9gv91n8o3i9.js","/creators-assets/_next/static/immutable/chunks/41i4r4u9uolgz.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/15q00pdqk0br3.js","/creators-assets/_next/static/immutable/chunks/293prjxu_wz0c.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3l2h8slpbzxqo.js","/creators-assets/_next/static/immutable/chunks/2xgtw4s-tlhet.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/1cphzzg2t2qo2.js"],"PostDetailCard"] 5e:T828,

Satsu is a dark, cinematic Framer template for drinks brands, product launches and direct-to-consumer startups that want a homepage people stop and scroll through.

The hero is a 180-frame, photoreal image sequence. As visitors scroll, the can tips toward them to show the ring-pull, swings upright, glides into a close-up of the label, leans, twists and settles front-on, with headlines fading in around it like an Apple product page. Phones get their own portrait sequence so the can always fits the screen.

Below the hero, bold stat tiles, a flavour range pulled from the CMS, a four-step "how it's made" story and an orange-glow call to action keep the page moving. Every flavour gets its own page, and the pre-order form takes flavour and pack size with sending, sent and error states. Swap in your own product frames, rename the flavours and the whole site is yours.

Features

5 pages: Home, Flavour (CMS), Story, Pre-order and 404
Scroll-scrubbed hero with 180 photoreal frames (desktop and tablet) and a separate 180-frame portrait sequence for phones
Four headlines that fade in around the product as it moves
Flavours CMS with name, tagline, description, price, size, tasting notes, accent colour, product image and detail image
Pre-order form with flavour and pack-size dropdowns, plus sending, sent and error states
Stat tiles, flavour cards, a four-step process and a glowing call to action
Translucent nav with anchor links, a full-screen phone menu and a footer on every page
Fully responsive across desktop, tablet and phone
9 colour styles and 9 text styles, Inter Display and Inter
SEO ready: one H1 per page, titles, descriptions and share images on every page, CMS-driven meta for flavours, alt text on images, favicon included
Uses one code component: Framer's ImageSequence. Swap the frames in the properties panel, no coding needed

5a:[["$","$L5d",null,{"post":{"id":"01a1000f-394e-730f-a854-9a6c06ec66d5","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"a030668e-0441-43b1-a437-58d5ae34def9","name":"Jyethetechguy","slug":"jye-curwood","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/a030668e-0441-43b1-a437-58d5ae34def9/wf3h1g9n","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"74550","resolved":true,"title":"Satsu","body":"$5e","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Satsu is a dark, cinematic Framer template for drinks brands, product launches and direct-to-consumer startups that want a homepage people stop and scroll through."}]},{"type":"paragraph","content":[{"type":"text","text":"The hero is a 180-frame, photoreal image sequence. As visitors scroll, the can tips toward them to show the ring-pull, swings upright, glides into a close-up of the label, leans, twists and settles front-on, with headlines fading in around it like an Apple product page. Phones get their own portrait sequence so the can always fits the screen."}]},{"type":"paragraph","content":[{"type":"text","text":"Below the hero, bold stat tiles, a flavour range pulled from the CMS, a four-step \"how it's made\" story and an orange-glow call to action keep the page moving. Every flavour gets its own page, and the pre-order form takes flavour and pack size with sending, sent and error states. Swap in your own product frames, rename the flavours and the whole site is yours."}]},{"type":"customHeading","content":[{"type":"text","text":"Features","marks":[{"type":"bold"}]}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"5 pages: Home, Flavour (CMS), Story, Pre-order and 404"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Scroll-scrubbed hero with 180 photoreal frames (desktop and tablet) and a separate 180-frame portrait sequence for phones"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Four headlines that fade in around the product as it moves"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Flavours CMS with name, tagline, description, price, size, tasting notes, accent colour, product image and detail image"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Pre-order form with flavour and pack-size dropdowns, plus sending, sent and error states"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Stat tiles, flavour cards, a four-step process and a glowing call to action"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Translucent nav with anchor links, a full-screen phone menu and a footer on every page"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Fully responsive across desktop, tablet and phone"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"9 colour styles and 9 text styles, Inter Display and Inter"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"SEO ready: one H1 per page, titles, descriptions and share images on every page, CMS-driven meta for flavours, alt text on images, favicon included"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Uses one code component: Framer's ImageSequence. Swap the frames in the properties panel, no coding needed"}]}]}]}]},"introduction":"Scroll to pour the launch.","slug":"satsu","author":{"framerUserId":"a030668e-0441-43b1-a437-58d5ae34def9","name":"Jyethetechguy","slug":"jye-curwood","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/a030668e-0441-43b1-a437-58d5ae34def9/wf3h1g9n","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/a030668e-0441-43b1-a437-58d5ae34def9/01a1000f-1d3c-7341-9fb5-726d31d72456.jpg","metadata":{"tint":{"h":0,"s":0,"l":9},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/a030668e-0441-43b1-a437-58d5ae34def9/01a1000f-1e0a-737e-81ab-ae95cc7b46d0.jpg","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/a030668e-0441-43b1-a437-58d5ae34def9/01a1000f-1d3c-745e-b488-9ec5c067e9e7.jpg","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/a030668e-0441-43b1-a437-58d5ae34def9/01a1000f-1e03-768e-80d8-77d4c167f7e2.jpg","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/a030668e-0441-43b1-a437-58d5ae34def9/01a1000f-1e2c-76f1-bd2a-ba7b00a39a2e.jpg","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-10-03T04:39:19.473Z","updatedAt":"2026-10-03T04:39:19.473Z","publishedAt":"2026-10-03T04:39:19.470Z","featuredAt":null,"approvedAt":null,"type":"template","attributes":{"price":"99","paymentUrl":"https://buy.stripe.com/5kQ9ATh2e4ie0SX2P3cjS0A","remixUrl":null,"previewUrl":"https://satsu.framer.website/","categories":[],"styles":[{"id":110,"name":"Animated","slug":"animated"},{"id":6,"name":"3D","slug":"3d"},{"id":201,"name":"Colorful","slug":"colorful"}],"mainCategory":{"id":115,"name":"Food","slug":"food"},"features":[],"tags":[],"isAgentTemplate":false,"demoVideo":null,"skills":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":0,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-10-03T04:39:20.142Z","updatedAt":"2026-10-03T04:39:20.142Z","reported":false}}],"$L5f"]

Suggested for you