Back to Components
Cards

Glow Card Stack

Stacked cards that spread a soft glow on hover.

Layer 1

Concept Pitch

Outline the narrative and visual direction.

Hover to spread glowLayer 1
Layer 2

Design Sprint

Refine the interaction and motion details.

Hover to spread glowLayer 2
Layer 3

Launch Prep

Deliver assets and polish the rollout.

Hover to spread glowLayer 3

Dependencies

  • clsx
  • tailwind-merge

Files

  • components/ui/glow-card-stack.tsx

Installation

Using shadcn CLI

npx shadcn add glow-card-stack --url https://ui.hampton.io

Manual installation

Copy the component file to your project and install dependencies:

npm install clsx tailwind-merge