About this component

A card made entirely of water. Features transparent water effects, floating reflections, internal wave lines, fish animation, ripple rings on hover, and splash droplets on click. Everything behaves like liquid.

Difficulty

Advanced

Style

Water / Liquid

Frameworks

HTML/CSS, Tailwind, React, Vue, Angular, Svelte, LWC

Embed this component

Paste this snippet into any site — the design renders in a sandboxed iframe served from /embed/water-surface-card.