Categories70

Categories

Alerts

20 beautifully crafted components available.

Default Alert

This alert has an accent border on the left side.

Destructive Alert

This alert has an accent border on the left side.

Success Alert

This alert has an accent border on the left side.

Warning Alert

This alert has an accent border on the left side.

Info Alert

This alert has an accent border on the left side.

Default Alert

This alert has accent borders on all sides.

Destructive Alert

This alert has accent borders on all sides.

Success Alert

This alert has accent borders on all sides.

Warning Alert

This alert has accent borders on all sides.

Info Alert

This alert has accent borders on all sides.

Default Alert

This is a default alert with subtle shadow.

Destructive Alert

This alert is used for error messages and destructive actions.

Success Alert

This alert indicates a successful action or positive outcome.

Warning Alert

This alert warns users about potential issues or important information.

Info Alert

This alert provides general information to the user.

Default Alert

This alert has an accent border on the bottom.

Destructive Alert

This alert has an accent border on the bottom.

Success Alert

This alert has an accent border on the bottom.

Warning Alert

This alert has an accent border on the bottom.

Info Alert

This alert has an accent border on the bottom.

Default Alert

This is a compact alert with less padding and smaller text.

Destructive Alert

This is a compact alert with less padding and smaller text.

Success Alert

This is a compact alert with less padding and smaller text.

Warning Alert

This is a compact alert with less padding and smaller text.

Info Alert

This is a compact alert with less padding and smaller text.

Default Alert

This alert has a dashed border style.

Destructive Alert

This alert has a dashed border style.

Success Alert

This alert has a dashed border style.

Warning Alert

This alert has a dashed border style.

Info Alert

This alert has a dashed border style.

Default Alert

This is a dismissible default alert.

Destructive Alert

This is a dismissible destructive alert.

Success Alert

This is a dismissible success alert.

Warning Alert

This is a dismissible warning alert.

Info Alert

This is a dismissible info alert.

Default Alert

This alert has a dotted border style.

Destructive Alert

This alert has a dotted border style.

Success Alert

This alert has a dotted border style.

Warning Alert

This alert has a dotted border style.

Info Alert

This alert has a dotted border style.

Default Alert

This alert has a double border style.

Destructive Alert

This alert has a double border style.

Success Alert

This alert has a double border style.

Warning Alert

This alert has a double border style.

Info Alert

This alert has a double border style.

Default Alert

This alert has a stronger shadow for an elevated appearance.

Destructive Alert

This alert has a stronger shadow for an elevated appearance.

Success Alert

This alert has a stronger shadow for an elevated appearance.

Warning Alert

This alert has a stronger shadow for an elevated appearance.

Info Alert

This alert has a stronger shadow for an elevated appearance.

Default Alert

This alert has a frosted glass appearance with backdrop blur.

Destructive Alert

This alert has a frosted glass appearance with backdrop blur.

Success Alert

This alert has a frosted glass appearance with backdrop blur.

Warning Alert

This alert has a frosted glass appearance with backdrop blur.

Info Alert

This alert has a frosted glass appearance with backdrop blur.

Default Alert

Hover to see the border glow effect.

Destructive Alert

Hover to see the border glow effect.

Success Alert

Hover to see the border glow effect.

Warning Alert

Hover to see the border glow effect.

Info Alert

Hover to see the border glow effect.

Default Alert

Alert with a prominent icon.

Destructive Alert

Alert with a prominent icon.

Success Alert

Alert with a prominent icon.

Warning Alert

Alert with a prominent icon.

Info Alert

Alert with a prominent icon.

Default Alert

This alert has an inset shadow to appear pressed into the page.

Destructive Alert

This alert has an inset shadow to appear pressed into the page.

Success Alert

This alert has an inset shadow to appear pressed into the page.

Warning Alert

This alert has an inset shadow to appear pressed into the page.

Info Alert

This alert has an inset shadow to appear pressed into the page.

Default Alert

This alert uses monospace font for a code-like appearance.

Destructive Alert

This alert uses monospace font for a code-like appearance.

Success Alert

This alert uses monospace font for a code-like appearance.

Warning Alert

This alert uses monospace font for a code-like appearance.

Info Alert

This alert uses monospace font for a code-like appearance.

Default Alert

This alert has a thicker border with transparent background.

Destructive Alert

This alert has a thicker border with transparent background.

Success Alert

This alert has a thicker border with transparent background.

Warning Alert

This alert has a thicker border with transparent background.

Info Alert

This alert has a thicker border with transparent background.

Default Alert

This alert has a paper-like texture background.

Destructive Alert

This alert has a paper-like texture background.

Success Alert

This alert has a paper-like texture background.

Warning Alert

This alert has a paper-like texture background.

Info Alert

This alert has a paper-like texture background.

Default Alert

This alert has a pulsing border animation.

Destructive Alert

This alert has a pulsing border animation.

Success Alert

This alert has a pulsing border animation.

Warning Alert

This alert has a pulsing border animation.

Info Alert

This alert has a pulsing border animation.

Default Alert

This alert has an accent border on the right side.

Destructive Alert

This alert has an accent border on the right side.

Success Alert

This alert has an accent border on the right side.

Warning Alert

This alert has an accent border on the right side.

Info Alert

This alert has an accent border on the right side.

Default Alert

This alert has an accent border on the top.

Destructive Alert

This alert has an accent border on the top.

Success Alert

This alert has an accent border on the top.

Warning Alert

This alert has an accent border on the top.

Info Alert

This alert has an accent border on the top.

Next Category: Announcement Banners

Quick Tips

Easy Implementation

Copy and paste these components directly into your project. All styles are handled via Tailwind CSS.

Notice

Use cli installation to avoid missing dependency , instead of doing just copy paste.

Woilasoft Agency

Sponsored

Woilasoft Agency

Woilasoft, your partner for custom digital solutions. We create the digital solutions

Sponsored

Templify

Create dynamic images programmatically, the canvas editor for automated design workflows.

Eventree

Sponsored

Eventree

An easy to use event management application for managing your events , start use it now !

Get started now