Chamaac UI

DocsComponentsSponsor

  • Overview

    • Get Started
    • Components

  • Animated Icons

    • Icons Overview

  • Backgrounds

    • Liquid ChromeNew
    • NebulaNew
    • WavesNew
    • Interactive Grid

  • Sections

    • How It WorksNew
    • Stats Cards
    • Feature Steps
    • Gauge

  • Buttons

    • Buttons Overview
    • Premium Button
    • Glowing BorderNew
    • Shimmer Button
    • Slide Up Button
    • Focus Button
    • Neo Brutalist
    • Hover ArrowNew

  • Text Animations

    • Text LoopNew
    • Dancing Letters
    • Gif Text

  • Inputs

    • AI Input

  • Navigation

    • Dock

  • Carousels

    • Carousel

Liquid Chrome

A mesmerizing, shader-driven liquid chrome animation ideal for modern landing pages.

Liquid Chrome

Customize

0.5
0.1

Installation

npx shadcn@latest add https://chamaac.com/r/liquid-chrome.json

Props

PropTypeDefaultDescription
classNamestring-Additional CSS classes for the container
speednumber0.5Overall animation speed multiplier
timeScalenumber0.1Intensity of the liquid warping
colorstring"#C0C0C0"Color 1 (Silver/Chrome)
color2string"#4A4A4A"Color 2 (Dark Gray)