5c:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/3jpuro209qqra.js","/creators-assets/_next/static/immutable/chunks/2qlox892e2j_q.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/1jubx4t_1hq7l.js","/creators-assets/_next/static/immutable/chunks/30hhj9fl_j_en.js","/creators-assets/_next/static/immutable/chunks/07e2f_v4-u-we.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/3orcs6a8eyfvz.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/120zfy8hqrcwf.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/2c_4he4mvu2r0.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3q7g04e77g4lf.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/0lmnldnlzsgok.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/0z2hzm-7v_g2c.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/2_qutx8yar-up.js","/creators-assets/_next/static/immutable/chunks/0p4vy6mn-x9zs.js"],"PostDetailCard"] 5d:T6ee,

About Better Grain

Grain is easy in one hero. The tax shows up across a real page.

Better Grain is a Framer grain overlay built around embedded WebP tiles and sprite sheets, not per-instance noise generation. Drop it on a section, set Quality, Motion, and Scale, then reuse the same texture system across sections.

Motion Off stays static. Animated modes run stepped sprite loops near the viewport, with static fallbacks for Canvas and reduced-motion contexts.

Built for builders who need grain to survive the page, not just look good in one hero.

Why Better Grain

Shared texture assets
Static tiles and animated sprite sheets stay embedded and are reused across placements, instead of generating fresh noise per overlay.
Motion is gated
Animated grain stays static offscreen, then runs near the viewport using stepped CSS keyframes with Subtle and Normal presets.
Framer fallbacks are handled
Canvas, static render, restricted render, and reduced-motion contexts return to static texture instead of forcing animation.
The overlay stays passive
Better Grain is pointer-safe and hidden from assistive tech, so it adds texture without blocking clicks or becoming interface content.

Good fit / Wrong fit

Good fit: you need controlled grain across repeated Framer sections.
Wrong fit: you only want hero grain or a shader-level film look.

Contact & Support

Questions about setup, product, or licensing: alexandre@madebymash.com

59:[["$","$L5c",null,{"post":{"id":"019b9c9c-2eb9-745e-a5c4-9d25b91c59c4","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"74b6f1af-e323-4a02-9c54-46f511512cea","name":"ALEXANDRE","slug":"alexherbigneaux","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/74b6f1af-e323-4a02-9c54-46f511512cea/dbon2qx8","followed":false,"followsYou":false},"media":[],"resources":[{"id":"pq3dQfkY9CYjYAUVx3UN","resolved":true,"title":"Better Grain","body":"$5d","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"About Better Grain"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Grain is easy in one hero. The tax shows up across a real page."}]},{"type":"paragraph","content":[{"type":"text","text":"Better Grain is a Framer grain overlay built around embedded WebP tiles and sprite sheets, not per-instance noise generation. Drop it on a section, set Quality, Motion, and Scale, then reuse the same texture system across sections."}]},{"type":"paragraph","content":[{"type":"text","text":"Motion Off stays static. Animated modes run stepped sprite loops near the viewport, with static fallbacks for Canvas and reduced-motion contexts."}]},{"type":"paragraph","content":[{"type":"text","text":"Built for builders who need grain to survive the page, not just look good in one hero."}]},{"type":"customHeading","content":[{"type":"text","text":"Why Better Grain"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Shared texture assets","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Static tiles and animated sprite sheets stay embedded and are reused across placements, instead of generating fresh noise per overlay."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Motion is gated","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Animated grain stays static offscreen, then runs near the viewport using stepped CSS keyframes with Subtle and Normal presets."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Framer fallbacks are handled","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Canvas, static render, restricted render, and reduced-motion contexts return to static texture instead of forcing animation."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"The overlay stays passive","marks":[{"type":"bold"}]},{"type":"text","text":" "}]},{"type":"paragraph","content":[{"type":"text","text":"Better Grain is pointer-safe and hidden from assistive tech, so it adds texture without blocking clicks or becoming interface content."}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Good fit / Wrong fit"}],"attrs":{"level":1}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Good fit:","marks":[{"type":"bold"}]},{"type":"text","text":" you need controlled grain across repeated Framer sections."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Wrong fit:","marks":[{"type":"bold"}]},{"type":"text","text":" you only want hero grain or a shader-level film look."}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Contact & Support"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Questions about setup, product, or licensing: "},{"type":"text","text":"alexandre@madebymash.com","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"mailto:alexandre@madebymash.com","target":"_blank"}}]}]}]},"introduction":"Texture without the tax","slug":"better-grain","author":{"framerUserId":"74b6f1af-e323-4a02-9c54-46f511512cea","name":"ALEXANDRE","slug":"alexherbigneaux","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/74b6f1af-e323-4a02-9c54-46f511512cea/dbon2qx8","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/74b6f1af-e323-4a02-9c54-46f511512cea/6geoi4jb"}],"post":null,"createdAt":"2025-12-26T09:28:37.917Z","updatedAt":"2026-08-12T11:46:06.374Z","publishedAt":"2026-01-08T07:57:19.929Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://framer.com/m/BetterGrain-TmcP.js@BcwISCg6UekXCNnY7xCh","previewUrl":"https://bettergrain.framer.website/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"1a3a0eb3-698e-461a-bf42-2502a7ed43e0","name":"Backgrounds","slug":"backgrounds"}],"lastSaveId":"BcwISCg6UekXCNnY7xCh"}}],"contests":[],"categories":[],"tags":[],"likes":{"count":33,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-01-08T07:57:19.929Z","updatedAt":"2026-01-08T07:57:19.929Z","reported":false}}],"$L5e"]

Suggested for you