5c:I[333483,["/creators-assets/_next/static/immutable/chunks/16d0e6blr3zvd.js","/creators-assets/_next/static/immutable/chunks/1rdgef59pv3cw.js","/creators-assets/_next/static/immutable/chunks/0zdv1ssrxkrvj.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/0gxswkth5mc6b.js","/creators-assets/_next/static/immutable/chunks/33adfll0sgxzj.js","/creators-assets/_next/static/immutable/chunks/41zrh_r6fdtfq.js","/creators-assets/_next/static/immutable/chunks/36invrtoq879v.js","/creators-assets/_next/static/immutable/chunks/19-jcjdymr-fa.js","/creators-assets/_next/static/immutable/chunks/2504rifrkrd_l.js","/creators-assets/_next/static/immutable/chunks/0j6nyijn0flqd.js","/creators-assets/_next/static/immutable/chunks/2b15v_9ruhnys.js","/creators-assets/_next/static/immutable/chunks/3zq_69yv5l6lg.js","/creators-assets/_next/static/immutable/chunks/19r4rf2zyng-y.js","/creators-assets/_next/static/immutable/chunks/3h1dt97hv5ik0.js","/creators-assets/_next/static/immutable/chunks/39xjxvqtwa0x7.js","/creators-assets/_next/static/immutable/chunks/17w9c6wazundy.js","/creators-assets/_next/static/immutable/chunks/1u1uuj9mj0hoo.js","/creators-assets/_next/static/immutable/chunks/14pxn0b6e1dc9.js","/creators-assets/_next/static/immutable/chunks/2iw_-bo8jogap.js","/creators-assets/_next/static/immutable/chunks/3o1z26bd2_9eh.js","/creators-assets/_next/static/immutable/chunks/2qeyp4zfa4qwb.js","/creators-assets/_next/static/immutable/chunks/1_2vu9p6mra4j.js","/creators-assets/_next/static/immutable/chunks/2qrxli96_t9cq.js","/creators-assets/_next/static/immutable/chunks/0w757zrv0hi6k.js","/creators-assets/_next/static/immutable/chunks/3edl5e308nytq.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/37uei1iwbnu3m.js","/creators-assets/_next/static/immutable/chunks/44oc0x6k7mw-i.js","/creators-assets/_next/static/immutable/chunks/2njnkxjf39nsf.js","/creators-assets/_next/static/immutable/chunks/27vyv0cqm_295.js","/creators-assets/_next/static/immutable/chunks/3n0g19afc7srh.js","/creators-assets/_next/static/immutable/chunks/3o3dwck1w1ue6.js","/creators-assets/_next/static/immutable/chunks/1h-r9oggqjick.js","/creators-assets/_next/static/immutable/chunks/05i2jce8amocn.js","/creators-assets/_next/static/immutable/chunks/02ciyo_cdpkrz.js","/creators-assets/_next/static/immutable/chunks/3sa-o_ztvtkwe.js","/creators-assets/_next/static/immutable/chunks/2051y-i4b0nnm.js"],"PostDetailCard"] 5d:T65a,

Fluidity helps you build responsive typography systems directly inside Framer.

Generate a complete fluid type scale from presets inspired by Tailwind, Material, Fluent, Carbon, Ant Design, Polaris, or your own custom ratio. Choose primary and secondary Framer library fonts, set your mobile-to-desktop viewport range, then create organized Framer Text Styles that scale smoothly with CSS clamp().

No more manually nudging headings across breakpoints. No more rebuilding the same type system from scratch.

What Fluidity does

Generate complete fluid type systems in seconds
Use familiar preset scales or a custom modular scale
Pair primary and secondary Framer library fonts
Create organized Framer Text Styles
Preview the scaling curve before saving
Scrub viewport widths to inspect exact font sizes
Copy the generated clamp() CSS
Apply fluid styles directly to selected text layers
Publish CSS clamp() rules automatically through Framer custom code

Built for real Framer workflows

Fluidity works with Framer Text Styles, so your typography stays reusable, editable, and organized. Use it for landing pages, client sites, product pages, design systems, and any project where type needs to behave across screens.

Design the scale once. Let the browser handle the resizing.

Fluidity’s preset scales are adapted for Framer workflows and are not official integrations with Tailwind, Material, Fluent, Carbon, Ant Design, or Polaris.

59:[["$","$L5c",null,{"post":{"id":"019ea924-c9ba-76b5-8a48-e4831cf2e176","title":null,"body":"

More features coming in soon

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"More features coming in soon"}]}]},"author":{"framerUserId":"e1099ee1-fb7a-435e-a30d-dcdec4cb305a","name":"PARTH GUPTA","slug":"parth-gupta-a701sn","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/e1099ee1-fb7a-435e-a30d-dcdec4cb305a/unw3ezx4","followed":false,"followsYou":false},"media":[],"resources":[{"id":"1253","resolved":true,"title":"Fluidity","body":"$5d","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Fluidity helps you build responsive typography systems directly inside Framer."}]},{"type":"paragraph","content":[{"type":"text","text":"Generate a complete fluid type scale from presets inspired by Tailwind, Material, Fluent, Carbon, Ant Design, Polaris, or your own custom ratio. Choose primary and secondary Framer library fonts, set your mobile-to-desktop viewport range, then create organized Framer Text Styles that scale smoothly with CSS clamp()."}]},{"type":"paragraph","content":[{"type":"text","text":"No more manually nudging headings across breakpoints. No more rebuilding the same type system from scratch."}]},{"type":"customHeading","content":[{"type":"text","text":"What Fluidity does"}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Generate complete fluid type systems in seconds"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Use familiar preset scales or a custom modular scale"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Pair primary and secondary Framer library fonts"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Create organized Framer Text Styles"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Preview the scaling curve before saving"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Scrub viewport widths to inspect exact font sizes"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Copy the generated clamp() CSS"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Apply fluid styles directly to selected text layers"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Publish CSS clamp() rules automatically through Framer custom code"}]}]}]},{"type":"customHeading","content":[{"type":"text","text":"Built for real Framer workflows"}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Fluidity works with Framer Text Styles, so your typography stays reusable, editable, and organized. Use it for landing pages, client sites, product pages, design systems, and any project where type needs to behave across screens."}]},{"type":"paragraph","content":[{"type":"text","text":"Design the scale once. Let the browser handle the resizing."}]},{"type":"paragraph","content":[{"type":"text","text":"Fluidity’s preset scales are adapted for Framer workflows and are not official integrations with Tailwind, Material, Fluent, Carbon, Ant Design, or Polaris."}]}]},"introduction":"Fluid type. No fuss.","slug":"fluidity","author":{"framerUserId":"e1099ee1-fb7a-435e-a30d-dcdec4cb305a","name":"PARTH GUPTA","slug":"parth-gupta-a701sn","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/e1099ee1-fb7a-435e-a30d-dcdec4cb305a/unw3ezx4","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/plugins/1253-S91ZWFoduacpfmktqcpcsVHY3xDmTv","metadata":{"tint":"hsl(60 53% 39%)","aspectRatio":1.3333333333333333}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/e1099ee1-fb7a-435e-a30d-dcdec4cb305a/019fde21-58cd-7101-a5d7-b0397a969583.jpg","metadata":{"tint":"hsl(60 53% 39%)","aspectRatio":1.3330557868442965}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/plugins/1253-UCJmwyYpkQ5uuRtAUAYRC3QQmEqtas","metadata":{"tint":"hsl(60 53% 39%)","aspectRatio":1.3333333333333333}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/plugins/1253-xZPLWEh9WlWGgxYu1LQ7JCQdIxqucm","metadata":{"tint":"hsl(60 53% 39%)","aspectRatio":1.3333333333333333}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/e1099ee1-fb7a-435e-a30d-dcdec4cb305a/019fde21-816f-75c7-a7d2-3610491ffecd.jpg","metadata":{"tint":"hsl(60 53% 39%)","aspectRatio":1.3333333333333333}}],"post":null,"createdAt":"2026-06-07T11:22:17.332Z","updatedAt":"2026-09-05T23:00:46.112Z","publishedAt":"2026-08-07T11:06:23.043Z","featuredAt":null,"approvedAt":null,"type":"plugin","attributes":{"framerPluginId":"9ysrcjsy73w52ep39ofxdwant","paid":false,"categories":[{"id":"3fc802d9-7527-48e0-9403-c9bd534ab520","name":"Utilities","slug":"utilities"},{"id":"b238ea64-0ce9-413a-848d-43b73f0eea0f","name":"Design Workflow","slug":"design-workflow"},{"id":"f6795017-0256-4955-b31a-c81a28ef20ff","name":"Integrations","slug":"integrations"}]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":28,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":2,"edited":true,"editedAt":"2026-09-05T23:00:47.089Z","createdAt":"2026-06-08T21:30:20.986Z","updatedAt":"2026-09-05T23:00:47.089Z","reported":false}}],"$L5e"]

Suggested for you