Transform your WordPress website into a living, breathing liquid surface — no coding experience required.
This is the same technology used in video games — rendering a true 3D liquid surface directly in your visitor's browser, reacting to every cursor movement in real time.
Every movement of your visitor's mouse creates realistic ripple waves that spread outward, reflect light, and interact with the background image — creating a first impression that is genuinely unforgettable.
Hardware-accelerated rendering in the browser. No plugins, no iframes, no compromise on performance.
Touch interaction on mobile and tablet devices also triggers ripple effects — the full experience everywhere.
Renders at z-index: −1 — completely behind your navigation, text, and buttons. Nothing is disrupted.
Approximately 180KB total. Does not block page rendering. LCP and FID scores are unaffected.
Realistic wave physics that radiate from every cursor position in real time.
Works with any JPG or WebP image. Swap it anytime with one line of code.
Adjust how mirror-like or matte the liquid surface appears — polished chrome to calm ocean.
Enable animated raindrops falling onto the surface for a dramatic, stormy atmosphere.
Control the height and drama of ripple waves from subtle (1) to cinematic (10).
Built-in responsive code to show a static background on small screens.
Calm Ocean, Stormy Night, Golden Hour, Arctic Ice, Deep Space — copy-paste ready.
Elementor, Divi, Astra, GeneratePress, and more — fully documented compatibility.
Runs entirely in JavaScript. Invisible to search engine crawlers. Rankings safe.
| Item | Details |
|---|---|
| liquid1.min.js Core | The WebGL library that powers the entire effect. Upload once to your WordPress media folder. |
| HTML Snippet Core | Complete, documented code to paste into WP Code — fully customisable, ready to go. |
| PDF Guide Core | Step-by-step implementation with screenshots, troubleshooting, and customisation options. |
| Sample Image Core | A background image to get started immediately. Replace with any image you choose. |
| 5 Presets Bonus | Calm Ocean · Stormy Night · Golden Hour · Arctic Ice · Deep Space — copy-paste ready. |
Five clear steps. No command line, no theme editing, no developer needed.
Log into your hosting file manager and upload liquid1.min.js to your wp-content/uploads folder.
Upload any JPG or WebP image. Note the full URL — you'll need it in the next step.
Search "WP Code" in WordPress Plugins → Add New. Install and activate in under two minutes.
Add a new HTML snippet, paste the provided code, replace the two URLs with your paths, and save.
Open your homepage in a new tab. Your background image will ripple with every cursor movement.
Replace four lines in the snippet and your site has a completely different personality.
Low intensity, soft waves. Wellness, lifestyle, and personal sites.
High metalness, rain enabled. Dramatic for bold brands.
Warm, reflective. Creative portfolios and photography.
Near-mirror surface. Clean and premium for tech and SaaS.
Dark and immersive. Agencies and portfolio sites.
Full support
Full support
macOS + iOS
Full support
Full support
Touch-enabled
No subscriptions. No monthly fees. Pay once, use on any of your websites.
Follow all the steps and still can't get the effect working? Contact us within 30 days for a full refund — no questions asked.
© 2026 writerly.in · All rights reserved · Personal and commercial use on your own websites only.
Redistribution or resale of the liquid1.min.js file or guide is not permitted.