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

About this Component

Fluid Cursor turns pointer movement into a real-time liquid trail powered by WebGL and Three.js.

Simply drop one instance anywhere on your Framer page. The component itself takes up 0×0px while the fluid effect automatically covers the full viewport without blocking clicks, scrolling, links, buttons, or other interactions.

Perfect For

Creative portfolios, agency websites, landing pages, experimental interfaces, product sites, and immersive Framer experiences.

Key Features

• Real-time GPU fluid simulation • Full-viewport cursor interaction • 0×0 drop-in component • Adjustable fluid size and force • Curl and turbulence controls • Motion trail and ink fade controls • Custom fluid color and opacity • Threshold and edge softness controls • Multiple blend modes • Adjustable Z-index • Physics and render-quality controls • Pixel-ratio control for performance • Desktop-only option • Non-interactive overlay that never blocks page content • Static-renderer safe for Framer Canvas and exports • No external runtime scripts or hosted dependencies

How It Works

Drop one instance onto your page and you're done. Fluid Cursor renders a fixed WebGL layer across the viewport and reacts automatically to mouse movement.

Use the Framer property panel to fine-tune the fluid behavior, appearance, edge treatment, blend mode, and rendering quality.

Questions?

Reach out at hasanwali6890@gmail.com

Refund Policy

Due to the digital, non-tangible nature of this product, all sales are final.

A refund may only be considered if the component has a confirmed critical technical issue that prevents it from functioning as described and the issue cannot be reasonably resolved. Refunds are not provided for buyer's remorse, aesthetic preference, incorrect setup, compatibility issues caused by custom modifications, or changes made after purchase.

5a:[["$","$L5d",null,{"post":{"id":"01a0c4fc-a356-75d8-88c4-88e90cb0f129","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"10767168-8381-4f2b-9206-2d6c344aae23","name":"Hasan Wali","slug":"hasan-wali","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/98885/avatar-WMhG6M5ak8XBca7qBEj8qK9rJSB8o7.jpg","followed":false,"followsYou":false},"media":[],"resources":[{"id":"Y9NthWIQGSnfwRN40H9S","resolved":true,"title":"Haytham Cursors v3.0","body":"$5e","bodyJson":{"type":"doc","content":[{"type":"customHeading","content":[{"type":"text","text":"About this Component"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Fluid Cursor turns pointer movement into a real-time liquid trail powered by WebGL and Three.js."}]},{"type":"paragraph","content":[{"type":"text","text":"Simply drop one instance anywhere on your Framer page. The component itself takes up 0×0px while the fluid effect automatically covers the full viewport without blocking clicks, scrolling, links, buttons, or other interactions."}]},{"type":"customHeading","content":[{"type":"text","text":"Perfect For"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Creative portfolios, agency websites, landing pages, experimental interfaces, product sites, and immersive Framer experiences."}]},{"type":"customHeading","content":[{"type":"text","text":"Key Features"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"• Real-time GPU fluid simulation • Full-viewport cursor interaction • 0×0 drop-in component • Adjustable fluid size and force • Curl and turbulence controls • Motion trail and ink fade controls • Custom fluid color and opacity • Threshold and edge softness controls • Multiple blend modes • Adjustable Z-index • Physics and render-quality controls • Pixel-ratio control for performance • Desktop-only option • Non-interactive overlay that never blocks page content • Static-renderer safe for Framer Canvas and exports • No external runtime scripts or hosted dependencies"}]},{"type":"customHeading","content":[{"type":"text","text":"How It Works"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Drop one instance onto your page and you're done. Fluid Cursor renders a fixed WebGL layer across the viewport and reacts automatically to mouse movement."}]},{"type":"paragraph","content":[{"type":"text","text":"Use the Framer property panel to fine-tune the fluid behavior, appearance, edge treatment, blend mode, and rendering quality."}]},{"type":"customHeading","content":[{"type":"text","text":"Questions?"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Reach out at "},{"type":"text","text":"hasanwali6890@gmail.com","marks":[{"type":"link","attrs":{"rel":"noopener noreferrer nofollow","href":"mailto:hasanwali6890@gmail.com","target":"_blank"}}]}]},{"type":"customHeading","content":[{"type":"text","text":"Refund Policy"}],"attrs":{"level":1}},{"type":"paragraph","content":[{"type":"text","text":"Due to the digital, non-tangible nature of this product, all sales are final."}]},{"type":"paragraph","content":[{"type":"text","text":"A refund may only be considered if the component has a confirmed critical technical issue that prevents it from functioning as described and the issue cannot be reasonably resolved. Refunds are not provided for buyer's remorse, aesthetic preference, incorrect setup, compatibility issues caused by custom modifications, or changes made after purchase."}]}]},"introduction":"GPU-powered fluid cursor effect","slug":"haytham-cursors-v3-0","author":{"framerUserId":"10767168-8381-4f2b-9206-2d6c344aae23","name":"Hasan Wali","slug":"hasan-wali","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/creators/98885/avatar-WMhG6M5ak8XBca7qBEj8qK9rJSB8o7.jpg","followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/10767168-8381-4f2b-9206-2d6c344aae23/01a0c4fc-195d-7799-ab3c-8672e2fdd957.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-09-21T17:21:25.768Z","updatedAt":"2026-09-21T17:21:25.768Z","publishedAt":"2026-09-21T17:21:25.765Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":null,"previewUrl":"https://newcomer-tools-162213.framer.app","price":"10","paymentUrl":"https://contra.com/payment-link/oM0Rx8xb-haytham-cursor-v30-gpu-powered-fluid-cursor-effect","workshop":false,"categories":[{"id":"c0182b81-fefe-45f5-ba00-27459f05e2a7","name":"Cursors","slug":"cursors"}],"lastSaveId":"lx6l6Es3zNJ2T5Md0PRj","tags":[]}}],"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-09-21T17:21:26.358Z","updatedAt":"2026-09-21T17:21:26.358Z","reported":false}}],"$L5f"]

Suggested for you