56:I[473921,["/creators-assets/_next/static/immutable/chunks/36c08p67t0nml.js","/creators-assets/_next/static/immutable/chunks/3ayu63s3pbx5h.js","/creators-assets/_next/static/immutable/chunks/2qqxwi6m3n33t.js","/creators-assets/_next/static/immutable/chunks/3283ev4bymz-y.js","/creators-assets/_next/static/immutable/chunks/1tyeiicl34tqo.js","/creators-assets/_next/static/immutable/chunks/24bk4ojcoor5n.js","/creators-assets/_next/static/immutable/chunks/3k0o12ps7rnq6.js","/creators-assets/_next/static/immutable/chunks/2fw--q9y_1nc-.js","/creators-assets/_next/static/immutable/chunks/00hohn9l3ocx9.js","/creators-assets/_next/static/immutable/chunks/271g_l-8c77ee.js","/creators-assets/_next/static/immutable/chunks/3uo-268z2xnq9.js","/creators-assets/_next/static/immutable/chunks/1eyot9c9uwocm.js","/creators-assets/_next/static/immutable/chunks/31xze_yiju0_q.js","/creators-assets/_next/static/immutable/chunks/06p8bv9p94pxh.js","/creators-assets/_next/static/immutable/chunks/42u1pxaq7eeka.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/2gb4kwi-0_ftg.js","/creators-assets/_next/static/immutable/chunks/0mgwzh6o644jl.js","/creators-assets/_next/static/immutable/chunks/0vxt9zvn936s0.js","/creators-assets/_next/static/immutable/chunks/102julo6bufcv.js","/creators-assets/_next/static/immutable/chunks/15z5hu5cixks0.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/3fujn21cf_mt1.js","/creators-assets/_next/static/immutable/chunks/0mwzcaalgk6io.js","/creators-assets/_next/static/immutable/chunks/2ch5kewqiwntv.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/2_dm0za3asre2.js","/creators-assets/_next/static/immutable/chunks/3wj273i6wglef.js","/creators-assets/_next/static/immutable/chunks/30ex342hi0wzr.js","/creators-assets/_next/static/immutable/chunks/0toe1wcov_38e.js","/creators-assets/_next/static/immutable/chunks/222e_wk0i41rv.js","/creators-assets/_next/static/immutable/chunks/28h79imj-g45k.js","/creators-assets/_next/static/immutable/chunks/3pe6luvwzbwnz.js","/creators-assets/_next/static/immutable/chunks/3nd1mzwm7q_f7.js","/creators-assets/_next/static/immutable/chunks/33kea80yupbzt.js","/creators-assets/_next/static/immutable/chunks/3oj8b9u7wi0dw.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/3f2ccywlofkgw.js","/creators-assets/_next/static/immutable/chunks/1-gdi7ej49wy6.js","/creators-assets/_next/static/immutable/chunks/05yll7e_snxjv.js"],"PostDetailCard"] 57:T6a9,

Give your website a futuristic, high-tech aesthetic with the Magnetic Liquid Core. This advanced WebGL background component renders a stunning, glowing orbital ring filled with a custom inner color and surrounded by thousands of dynamic floating particles.

Designed for maximum interactivity, the core and its particles react magnetically to the user's cursor. As the mouse moves across the canvas, the fluid ring warps and the particles pull toward the cursor, creating a highly immersive and satisfying visual experience. Engineered for top-tier performance, it leverages pure GLSL shaders and includes a smart visibility sensor that automatically pauses rendering when scrolled out of view. Perfect for Web3 platforms, modern SaaS landing pages, and creative portfolios.

Functions (Key Features):

🧲 Magnetic Interaction: The fluid core and particles warp and pull dynamically towards the user's cursor based on customizable strength and range parameters.
✨ Particle Swarm: Renders up to 30,000 orbiting particles with fluid, wave-like physics for a dense, atmospheric look.
🎨 Custom Fill & Glow: Independent color controls for the background, glowing core edge, internal core fill, and particles.
📏 Precise Positioning: Easily offset the core along the X and Y axes to perfectly frame it within your specific layout.
🚀 Optimized Performance: GPU-accelerated WebGL rendering with an automatic off-screen pause mechanism to conserve battery and CPU.

53:[["$","$L56",null,{"post":{"id":"019e26ba-ef29-7e55-9643-d94396e07c17","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"0c5ede99-5a4e-45b9-81b3-1bb1634bd38c","name":"Sirrah Space","slug":"sirrahspace","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/0c5ede99-5a4e-45b9-81b3-1bb1634bd38c/22zqe6c5","followed":false,"followsYou":false},"media":[],"resources":[{"id":"OspPhfDi4byG8fNXOrJd","resolved":true,"title":"Magnetic Liquid Core","body":"$57","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Give your website a futuristic, high-tech aesthetic with the "},{"type":"text","text":"Magnetic Liquid Core","marks":[{"type":"bold"}]},{"type":"text","text":". This advanced WebGL background component renders a stunning, glowing orbital ring filled with a custom inner color and surrounded by thousands of dynamic floating particles."}]},{"type":"paragraph","content":[{"type":"text","text":"Designed for maximum interactivity, the core and its particles react magnetically to the user's cursor. As the mouse moves across the canvas, the fluid ring warps and the particles pull toward the cursor, creating a highly immersive and satisfying visual experience. Engineered for top-tier performance, it leverages pure GLSL shaders and includes a smart visibility sensor that automatically pauses rendering when scrolled out of view. Perfect for Web3 platforms, modern SaaS landing pages, and creative portfolios."}]},{"type":"paragraph","content":[{"type":"text","text":"Functions (Key Features):","marks":[{"type":"bold"}]}]},{"type":"bulletList","content":[{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"🧲 "},{"type":"text","text":"Magnetic Interaction:","marks":[{"type":"bold"}]},{"type":"text","text":" The fluid core and particles warp and pull dynamically towards the user's cursor based on customizable strength and range parameters."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"✨ "},{"type":"text","text":"Particle Swarm:","marks":[{"type":"bold"}]},{"type":"text","text":" Renders up to 30,000 orbiting particles with fluid, wave-like physics for a dense, atmospheric look."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"🎨 "},{"type":"text","text":"Custom Fill & Glow:","marks":[{"type":"bold"}]},{"type":"text","text":" Independent color controls for the background, glowing core edge, internal core fill, and particles."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"📏 "},{"type":"text","text":"Precise Positioning:","marks":[{"type":"bold"}]},{"type":"text","text":" Easily offset the core along the X and Y axes to perfectly frame it within your specific layout."}]}]},{"type":"listItem","content":[{"type":"paragraph","content":[{"type":"text","text":"🚀 "},{"type":"text","text":"Optimized Performance:","marks":[{"type":"bold"}]},{"type":"text","text":" GPU-accelerated WebGL rendering with an automatic off-screen pause mechanism to conserve battery and CPU."}]}]}]},{"type":"paragraph"}]},"introduction":"Interactive WebGL magnetic core.","slug":"magnetic-liquid-core","author":{"framerUserId":"0c5ede99-5a4e-45b9-81b3-1bb1634bd38c","name":"Sirrah Space","slug":"sirrahspace","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/0c5ede99-5a4e-45b9-81b3-1bb1634bd38c/22zqe6c5","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/OspPhfDi4byG8fNXOrJd/magnetic-liquid-core-DrSKYfzvctXkRjjtLX6XSNCsWyH2lq","metadata":{"tint":{"h":240,"s":50,"l":6},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-05-11T07:51:09.241Z","updatedAt":"2026-07-26T11:27:47.113Z","publishedAt":"2026-05-14T13:44:05.673Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://empowered-suggestions-603387.framer.app/","price":"5","paymentUrl":"https://sirrahspace.lemonsqueezy.com/checkout/buy/8a7918b8-3241-4bc7-a18a-e94de18cd335","workshop":false,"categories":[{"id":"1a3a0eb3-698e-461a-bf42-2502a7ed43e0","name":"Backgrounds","slug":"backgrounds"}],"lastSaveId":"6AmcgLYqDF912F2FEBx3","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":7,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-05-14T13:44:05.673Z","updatedAt":"2026-05-14T13:44:05.673Z","reported":false,"type":"post"}}],"$L58"]

Suggested for you