Y
Yhooi2/shadcn-glass-ui-library
Alert Glassalert-glassGlass-themed alert with:
Avatar Glassavatar-glassGlass-themed avatar with:
Badge Glassbadge-glassGlass-themed badge with:
Button Glassbutton-glassGlass-themed button with:
Card Glasscard-glassCardGlass Compound Component
Checkbox Glasscheckbox-glassGlass-themed checkbox built on Radix UI primitives with:
Circular Progress Glasscircular-progress-glassSVG-based circular progress indicator with gradient colors and glow effects. * Supports both determinate (0-100%) and indeterminate (spinner) variants. * * ## Features
Combobox Glasscombobox-glassGlass-themed combobox (searchable select) combining autocomplete and dropdown functionality. * Built on Radix UI Popover and cmdk for robust keyboard navigation and filtering. * * ## Features
Dropdown Glassdropdown-glassGlass-themed dropdown menu with simple and compound APIs for maximum flexibility. * Wrapper around DropdownMenuGlass for quick menu creation. * * ## Features
Dropdown Menu Glassdropdown-menu-glassDropdownMenuGlass - Compound Component
Glass Cardglass-cardGlass-themed container with backdrop blur, glow effects, and hover animations. * Provides a foundational card component for glassmorphism UIs. * * ## Features
Hover Card Glasshover-card-glassHover-triggered floating glass-themed container for rich content previews. * Unlike PopoverGlass (click-triggered), HoverCardGlass opens on hover after a configurable delay. * * ## Features
Input Glassinput-glassGlass-themed input with:
Modal Glassmodal-glassModalGlass Component (Radix UI Dialog-based)
Notification Glassnotification-glassGlass-themed toast notification with variant-based styling, icons, and dismiss functionality. * Provides visual feedback for user actions and system events. * * ## Features
Popover Glasspopover-glassFloating glass-themed container for tooltips, dropdowns, and contextual overlays. * Provides compound and legacy APIs for maximum flexibility. * * ## Features
Scroll Area Glassscroll-area-glassCustom scrollable container with glass-themed scrollbars. * Built on @radix-ui/react-scroll-area for cross-browser consistency. * * ## Features
Select Glassselect-glassGlass-themed select dropdown with compound component API for flexible composition. * Built on @radix-ui/react-select for accessibility, keyboard navigation, and robust selection behavior. * * ## Features
Separator Glassseparator-glassA glass-themed separator/divider component for visual content separation. * Based on @radix-ui/react-separator with glassmorphism styling. * * Issue #27: Feature request for standalone SeparatorGlass * * @example * ```tsx * // Horizontal separator (default) * <SeparatorGlass /> * * // Vertical separator * <SeparatorGlass orientation="vertical" className="h-4" /> * * // With glow effect * <SeparatorGlass glow /> * * // Decorative (hidden from screen readers) * <SeparatorGlass decorative /> * ```
Sheet Glasssheet-glassGlass-themed sheet/drawer component with full shadcn/ui Sheet API compatibility. * Slides in from top, right, bottom, or left edges with backdrop overlay and blur effects. * * ## Features
Sidebar Contextsidebar-contextSidebarGlass Context
Sidebar Glasssidebar-glassSidebarGlass Core Components
Sidebar Menusidebar-menuSidebarGlass Menu Components
Skeleton Glassskeleton-glassGlass-themed loading skeleton with:
Slider Glassslider-glassGlass-themed range slider built on Radix UI with shadcn/ui compatible API:
Stepper Glassstepper-glassStepperGlass Component (Compound API)
Switch Glassswitch-glassGlass-themed toggle switch with smooth animations and accessibility features. * Built on @radix-ui/react-switch for robust state management and keyboard navigation. * * ## Features
Tabs Glasstabs-glassTabsGlass Component (Radix UI based)
Toggle Glasstoggle-glassGlass-themed toggle switch with shadcn/ui compatible API:
Tooltip Glasstooltip-glassGlass-themed tooltip with: