Skip to content
DocsComponentsThemingMotion

Getting started

  • Introduction
  • Installation
  • Components
  • Theming
  • Motion
  • Accessibility

Components

  • Button
  • Dropdown Menu
  • Tab Bar
  • Tabs
  • Toast
  • Toolbar

Components

Each one extends the shadcn/ui component of the same name and keeps its API. Open one to try it on glass.

  • ButtonGlass button that swells under the finger, stretches on drag, and morphs its width and content. Includes a prominent tinted variant.
  • Dropdown MenuGlass menus that grow out of their trigger as a droplet and fold back into it through a teardrop neck, keeping the focus management of the shadcn dropdown menu.
  • Tab BarFloating glass tab bar with a search button: search collapses the tabs into a circle and stretches the button into a field, and the two glass surfaces fuse when pressed.
  • TabsGlass tabs with a lifting, magnifying lens you can drag across tabs, keeping the keyboard navigation of shadcn Tabs.
  • ToastTop-center glass notifications with pill formation, soft stacking, and Sonner accessibility.
  • ToolbarFloating glass toolbar: groups of swelling buttons on one capsule with a lifting selection lens, and round buttons beside them that fuse with it when pressed.
PreviousInstallationNextTheming

Early stage. APIs may still change, so add liquidcn to existing projects with care.

Built on shadcn/ui. The source is on GitHub under the MIT license.