Glow Border Button

A button wrapped in a soft, two-layer ambient halo that breathes at rest and calmly brightens on hover — pure CSS, no animation library.

Buttonsbuttonglowcss-only

Stack: React + Tailwind CSS + shadcn/ui — every prompt is written for this stack and is most accurate in it.

Overview

Layout

Two blurred halo layers behind, -z-20/-z-10

Color

bg-primary/10 outer bloom, bg-primary/20 inner glow

Motion

Pulse breathes at rest, settles calm on hover

Accessibility

Both halo layers are aria-hidden decoration