Liquid Glass CTA

CTAs 6

About

A glass-capsule newsletter sign-up form that floats over a slow drifting aurora background, bends the colour behind it at its rim, catches light at the pointer, and squashes like a liquid drop on successful submit.

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

Code

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

Usage.tsx

"use client";

import LiquidGlassCta from "@/components/ui/liquid-glass-cta";

export default function LiquidGlassCtaDemo() {
  return (
    <div className="flex min-h-screen w-full items-center justify-center">
      <LiquidGlassCta
        palette="dusk"
        eyebrow="The Sunday Letter · from Vitrine"
        headline="One careful email, every Sunday."
        sub="How good product teams in the Gulf plan, ship and write about it. Four minutes, no tracking pixels."
        action="Subscribe"
      />
    </div>
  );
}