Skip to content

Feedback & Overlays

Dialogs, notifications and loading states.

31 components

Toast Notifications – Tailwind CSS toasts preview

Toast Notifications

Stacking Tailwind CSS toast notifications for success, error and info with auto-dismiss countdown, pause on hover and accessible live region.

Cookie Consent Banner – Tailwind CSS cookie banners preview

Cookie Consent Banner

Tailwind CSS cookie consent banner with accept, reject and a settings dialog with category switches, saved to localStorage with a consent event.

Empty State with Illustration – Tailwind CSS empty states preview

Empty State with Illustration

Tailwind CSS empty state with an animated inline SVG illustration, clear headline, primary and secondary call-to-action buttons and template shortcuts.

Skeleton Card Loader – Tailwind CSS skeleton loaders preview

Skeleton Card Loader

Tailwind CSS skeleton loaders for an article card grid and a list, with pulse or shimmer animation that swaps to real content once loaded.

Full-Page Loader – Tailwind CSS loaders & spinners preview

Full-Page Loader

Tailwind CSS full-page loader overlay with a spinning gradient ring, progress bar and status messages that fades out once the page has loaded.

CSS Spinner Collection – Pure CSS loaders & spinners preview

CSS Spinner Collection

Eight lightweight pure CSS loading spinners in a labelled grid, each with role="status" and screen reader text, no JavaScript.

Modal Dialog – Tailwind CSS modals preview

Modal Dialog

Accessible Tailwind CSS modal dialog with focus trap, Escape and backdrop close, scroll lock and a type-to-confirm delete action.