Overlays
npx @intellihelper/cli add.About overlays
How this category fits the Liquid Glass system
Overlay components surface temporary UI without breaking immersion — dialogs, alert dialogs, sheets, popovers, tooltips, hover cards, dropdowns, and context menus with Liquid Glass treatment for React and Next.js.
Glass overlays need careful contrast: frosted panels must stay readable over blurred page content. Intelli UI primitives use elevated chrome, strong focus management, and Radix-style accessibility patterns so keyboard and screen-reader users get first-class support. Sheets suit mobile-first filters; Dialogs confirm high-stakes actions; Popovers and Hover Cards explain without navigation.
Install free overlay components via the IntelliHelper CLI and customize animation and blur tokens in your codebase. Ideal for product tours, settings drawers, command menus, and AI chat confirmations. Teams evaluating shadcn alternatives for modal and sheet UX get the same copy-paste ownership model with a distinctive glass look.
Components
- DialogHighly transparent modal with frosted overlay and rise-in content.
- Alert DialogConfirmation modal for destructive and irreversible actions.
- SheetEdge slide-in glass panel with spring animation.
- PopoverClick-triggered frosted panel for contextual actions.
- Dropdown MenuGlass action menus with checkboxes, radios, and nested submenus.
- Context MenuRight-click glass menus for lists, tables, and canvases.
- Hover CardRich hover previews with spring scale-in animation.
- TooltipFrosted contextual hints with spring scale-in.
- CommandFilterable command palette with dialog mode and keyboard nav.
- Floating WidgetChat-style corner bubble with a compact panel for feedback or messaging.
Looking for something else?