Shadcn.io is not affiliated with official shadcn/ui
Destructive with Warning Badge
A destructive alert dialog with a red Permanent Action badge between title and description for extra emphasis
Sometimes a red button isn't enough warning. This React alert dialog adds a Permanent Action badge with destructive styling between the title and description to force a visual speed bump. Built with shadcn/ui and Radix UI with Database icon from Lucide React, the badge creates a distinct warning layer. Perfect for data purges, cache clears, or any irreversible operation where an extra visual barrier prevents accidental catastrophe.
Destructive with Warning Badge preview
Installation
Related Components
Delete with Icon
Destructive confirmation with icon
Destructive with Consequences
Bulleted list of deletion impacts
Destructive Badge
Standalone destructive badge patterns
Destructive with Checkbox
Checkbox confirmation requirement
Destructive Alert
Inline destructive alert component
Simple Confirmation
Non-destructive confirmation pattern
FAQ
Was this page helpful?
Sign in to leave feedback.