Liquid Chrome
Molten chrome, iridescent foil and dispersion glass: surfaces that ripple and shine.
Every asset, standalone
Designed together as one site, then cut apart. Take one, or take the whole kit.
Molten Chrome Hero
heroesA first screen whose title is molten chrome in WebGL: the lit room it reflects turns with the pointer, the metal swells toward it, fast moves and clicks send ripples through the letters, and it stands on a mirror floor.
Holo Foil Field
backgroundsA full-bleed sheet of crumpled holographic foil in WebGL: its thin-film colours follow Newton's series, each face flashes silver or falls dark as it turns, and tilting it with the pointer sweeps the colour across the sheet.
Chrome Pill Button
componentsA pill of polished chrome that reflects a lit room: its horizon, softbox glint and bezel light turn toward the pointer, and a press squashes it and drops a ring into the surface.
Holo Ticket Card
componentsA tour date as a notched, perforated ticket whose stub carries the date in chrome numerals on a strip of holographic foil; it tilts toward the pointer while the foil's colour slides and a glare follows.
Pour Tracklist Section
sectionsAn album tracklist where each row is its own progress bar: liquid chrome pours across the row as the preview plays, the labels under the metal turn dark, and you scrub by dragging the row.
Mirror Pool Footer
sectionsA footer whose giant chrome wordmark stands on the waterline of a dark pool that mirrors it: a real wave simulation rings under the pointer and takes a drop every ten seconds, bending the reflection as it ripples.
Pour Fill Heading
text effectsA heading that starts as an empty mould and fills with liquid chrome as it scrolls into view, its surface a meniscus with a hot line of light that sloshes with scroll speed and settles.
Chrome Rim Input
patternsAn email field in a pill with a chrome rim: each keystroke sends two ripples of light racing round the rim from the caret, a light laps it while sending, and success pours the pill into a round chrome drop with a check.
Chrome Vinyl Preorder
sectionsA vinyl pre-order you can play with: flick the canvas record and it spins with inertia under a sheen that stays with the light, the chrome tonearm swings on when it spins fast, and the pressings sit beside it as a radio group.
Mercury Pour Nav
componentsA floating nav whose current-link indicator is a capsule of mercury on two springs: it stretches thin as it pours to the next link, snaps back round, reaches toward the link you hover, and turns the labels it covers dark.
Chrome Pour Reveal
animationsA reveal that casts its content in liquid chrome: molten metal pours down over the space with drips racing ahead and merging into the sheet, then cools away from the top behind a hot seam of light.
The site they were cut from
Every asset above, composed as one working site. It ships with the kit.
Complete kit · Drop 05
The whole Liquid Chrome kit in one command.
npx shadcn@latest add @viberdy/molten-chrome-hero @viberdy/holo-foil-field @viberdy/chrome-pill-button @viberdy/holo-ticket-card @viberdy/pour-tracklist-section @viberdy/mirror-pool-footer @viberdy/pour-fill-heading @viberdy/chrome-rim-input @viberdy/chrome-vinyl-preorder @viberdy/mercury-pour-nav @viberdy/chrome-pour-reveal @viberdy/liquid-chrome-site6 Pro and 6 free assets. Pro installs through the @viberdy namespace with your API key, set up once. Set it up
More Liquid Chrome in the library
Iridescent Foil Sweep
text effectsHot-foil type that shifts colour under the pointer — Newton's series rather than a rainbow, translated rather than rotated.