Liquid Glass Button

Buttons 6.6K

About

Liquid Glass Button

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Liquid Glass Button to your project and fits it to your theme.

Code

How Liquid Glass Button is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { LiquidButton } from "@/components/ui/liquid-glass-button";

export default function DemoOne() {
  return (
    <> 
      <div className="relative h-[200px] w-[800px]"> 
        <LiquidButton className="absolute top-1/2 left-1/2 z-10 -translate-x-1/2 -translate-y-1/2">
          Liquid Glass
        </LiquidButton> 
      </div>
    </>
  )
}