Vibe UI
Initializing Vibe UI System...

Alert

Displays a callout block for user attention, system statuses, errors, warnings, or indicators.

Alert

Displays a callout block for user attention, system statuses, errors, warnings, or indicators.

Preview

Installation

pnpm dlx vibe-ui-kit@latest add alert

Component Presets

Explore premium combinations and styles of the Alert component.

Status Stack

A combination of Success and Destructive alerts showing smooth scale hover micro-animations and rich text layouts.

Actionable Alerts

Alerts containing action triggers (like diagnostic buttons) and inline dismiss controls.

Custom Themes

Frosted Glassmorphic presets and high-contrast terminal Cyberpunk themes rendered together.

Accent & Outline

High-contrast Neobrutalist retro outlines and color-highlighted accent border indicators.

System Monitor

A live cloud diagnostic dashboard widget displaying deploy tags and high-RAM warn meters.

Security Center

Full actionable security threat panels featuring control buttons to block IPs or setup Multi-factor Authentication (MFA).

Props

PropTypeDefaultDescription
variant"default" | "destructive" | "success" | "warning" | "glass" | "retro" | "glow" | "cyberpunk""default"Visual preset theme variant.

Contributors

JS
Jenish Sabhadiya

Theme Customizer

8px
@theme {
  --radius: 0.5rem;
  --glass-blur: 8px;
}
Changes apply instantly to this documentation workspace.
Alert | Vibe UI