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:Tad0,

Turn ordinary text into soft, volumetric cloud art with a single component.

Puffy Cloud transforms words into dreamy, animated clouds that feel light, organic, and alive. Perfect for hero sections, landing pages, portfolios, creative campaigns, and playful interactions where typography becomes part of the visual experience instead of just another heading.

No images required — simply type your text and let the component generate the cloud effect in real time.

✨ Features

Dynamic cloud text rendering with a soft volumetric look
Live text editing with instant updates
Fully customizable cloud appearance and density
Adjustable dissolve and particle spawning behavior
Environment and lighting controls for different moods
Built-in animation and subtle parallax movement
Object interaction support
Camera and layout customization
Post-processing controls for fine-tuning the final look
Optimized for responsive Framer projects
Lightweight and easy to integrate into existing designs

🎯 Perfect For

Landing page heroes
Creative portfolios
SaaS marketing websites
Agency showcases
Product launches
Event pages
Interactive typography
Experimental web experiences

⚙ Customization

Every major visual parameter can be adjusted directly from the Framer properties panel:

Text content
Font family & weight
Font size
Letter spacing
Cloud softness
Density & appearance
Dissolve speed
Spawn behavior
Lighting intensity
Animation strength
Camera settings
Post-processing effects

Create anything from subtle fog-like lettering to bold fluffy typography without touching code.

🚀 Performance

Built with smooth rendering and optimized interactions in mind, Puffy Cloud maintains a responsive experience while delivering a premium visual effect suitable for production websites.

Whether you're building a modern portfolio or an eye-catching product launch, Puffy Cloud helps your typography stand out in seconds.

5a:[["$","$L5d",null,{"post":{"id":"019ed344-b61a-734e-8344-24f57d034393","title":null,"body":"

Text to cloud, easy

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Text to cloud, easy"}]}]},"author":{"framerUserId":"dc4bbb98-4a18-4f3c-b305-1af93e5a721a","name":"madebyli@m","slug":"madebyliam","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/dc4bbb98-4a18-4f3c-b305-1af93e5a721a/j6o1of7r","followed":false,"followsYou":false},"media":[],"resources":[{"id":"g0pK0YluI77emMe10b0j","resolved":true,"title":"Puffy Cloud","body":"$5e","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Turn ordinary text into soft, volumetric cloud art with a single component."}]},{"type":"paragraph","content":[{"type":"text","text":"Puffy Cloud","marks":[{"type":"bold"}]},{"type":"text","text":" transforms words into dreamy, animated clouds that feel light, organic, and alive. Perfect for hero sections, landing pages, portfolios, creative campaigns, and playful interactions where typography becomes part of the visual experience instead of just another heading."}]},{"type":"paragraph","content":[{"type":"text","text":"No images required — simply type your text and let the component generate the cloud effect in real time."}]},{"type":"customHeading","content":[{"type":"emoji","attrs":{"name":"sparkles","emoji":"✨"}},{"type":"text","text":" Features","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Dynamic cloud text rendering with a soft volumetric look"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Live text editing with instant updates"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Fully customizable cloud appearance and density"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Adjustable dissolve and particle spawning behavior"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Environment and lighting controls for different moods"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Built-in animation and subtle parallax movement"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Object interaction support"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Camera and layout customization"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Post-processing controls for fine-tuning the final look"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Optimized for responsive Framer projects"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Lightweight and easy to integrate into existing designs"}]}]}]},{"type":"customHeading","content":[{"type":"emoji","attrs":{"name":"dart","emoji":"🎯"}},{"type":"text","text":" Perfect For","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Landing page heroes"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Creative portfolios"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"SaaS marketing websites"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Agency showcases"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Product launches"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Event pages"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Interactive typography"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Experimental web experiences"}]}]}]},{"type":"customHeading","content":[{"type":"emoji","attrs":{"name":"gear","emoji":"⚙"}},{"type":"text","text":" Customization","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Every major visual parameter can be adjusted directly from the Framer properties panel:"}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Text content"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Font family & weight"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Font size"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Letter spacing"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Cloud softness"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Density & appearance"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Dissolve speed"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Spawn behavior"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Lighting intensity"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Animation strength"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Camera settings"}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"Post-processing effects"}]}]}]},{"type":"paragraph","content":[{"type":"text","text":"Create anything from subtle fog-like lettering to bold fluffy typography without touching code."}]},{"type":"customHeading","content":[{"type":"emoji","attrs":{"name":"rocket","emoji":"🚀"}},{"type":"text","text":" Performance","marks":[{"type":"bold"}]}],"attrs":{"level":2}},{"type":"paragraph","content":[{"type":"text","text":"Built with smooth rendering and optimized interactions in mind, Puffy Cloud maintains a responsive experience while delivering a premium visual effect suitable for production websites."}]},{"type":"paragraph","content":[{"type":"text","text":"Whether you're building a modern portfolio or an eye-catching product launch, Puffy Cloud helps your typography stand out in seconds."}]}]},"introduction":"Text and icon to cloud","slug":"puffy-cloud","author":{"framerUserId":"dc4bbb98-4a18-4f3c-b305-1af93e5a721a","name":"madebyli@m","slug":"madebyliam","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/dc4bbb98-4a18-4f3c-b305-1af93e5a721a/j6o1of7r","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/dc4bbb98-4a18-4f3c-b305-1af93e5a721a/mp3x9khh","metadata":{"tint":{"h":210,"s":45,"l":36},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-06-17T01:49:16.119Z","updatedAt":"2026-06-22T02:54:30.257Z","publishedAt":"2026-06-17T01:49:16.073Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://jolly-tasks-096939.framer.app/","price":"10","paymentUrl":"https://buy.polar.sh/polar_cl_peqjO67bABtKtFtnqzTsHJSlWzEQGGPSbozHM0nzmyx","workshop":false,"categories":[{"id":"7fe42fdd-1b16-4f5a-93b8-009488614de8","name":"Text","slug":"text"}],"lastSaveId":"MCSmmxUYf8xrrRjMYn4c","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":2,"edited":true,"editedAt":"2026-06-21T06:04:21.759Z","createdAt":"2026-06-17T01:49:16.187Z","updatedAt":"2026-06-21T06:04:21.759Z","reported":false}}],"$L5f"]

Suggested for you