@animate-ui

An animated avatar group that displays overlapping user images and smoothly shifts each avatar forward on hover to highlight it.

A code component that animates the code as it is written.

A tabs component that displays code for different languages.

An animated cursor component that allows you to customize both the cursor and cursor follow elements with smooth animations.

A scrolling wheel that displays GitHub stars count.

A set of layered sections of content—known as tab panels—that are displayed one at a time.

A tooltip is a small box that appears when hovering over an element.

An interactive background featuring smoothly animated gradient bubbles, creating a playful, dynamic, and visually engaging backdrop.

A background component that displays a fireworks animation.

A background component featuring a subtle yet engaging animated gradient effect, smoothly transitioning colors to enhance visual depth.

A background component featuring a subtle yet engaging animated gravity stars effect.

A background component featuring an interactive hexagon grid.

A background component featuring an animated hole grid.

An interactive background featuring animated dots of varying sizes and speeds, simulating a dynamic and immersive starry space effect.

A set of collapsible panels with headings.

A dialog that requires user response to proceed.

An easily stylable checkbox component.

A popup that opens on top of the entire page.

A component that allows you to display a list of files and folders.

A list of actions in a dropdown, enhanced with keyboard navigation.

An accessible popup anchored to a button.

A popup that appears when a link is hovered, showing a preview for sighted users.

Displays a preview image of a link when hovered.

Displays the status of a task that takes a long time.

An easily stylable radio button component.

A control that indicates whether a setting is on or off.

A component for toggling between related panels on the same page.

A two-state button that can be on or off.

Provides a shared state to a series of toggle buttons.

A popup that appears when an element is hovered or focused, showing a hint for sighted users.

A button component with a variety of styles and animations.

A copy button component with a variety of styles and animations.

A button that flips between two states on hover.

A clickable button that links to a GitHub repository and displays the number of stars.

An icon button component with a variety of styles and animations.

A button that fills on hover.

A button that animates on tap with a ripple effect.

A button that toggles the theme gradually.

A 3D animated card component that flips to reveal content on the back.

A management bar for managing items.

A carousel built on top of Embla Carousel with smooth Motion-powered animations. Each slide scales dynamically based on its active state, and the pagination us…

A fun notification list with animated stacking and cards that expand as you interact.

A playful list for pinning and unpinning items, with smooth animated transitions as items move between groups.

A playful todolist component with animated wavy strikethroughs for each completed task.

A circular intro animation component that arranges elements in a radial layout, smoothly transitioning them into orbit with looping motion.

A circular context menu built with Base UI, displaying actions in a clean radial layout with full keyboard support and smooth interaction.

A circular navigation menu with animated pointer and expanding buttons for smooth interactive transitions.

This is a button for sharing.

A compact avatar group for showing online and offline users, with smooth animated transitions when presence changes.

A vertically stacked set of interactive headings that each reveal an associated section of content.

Checkboxes provide the same functionality as native HTML checkboxes, without any of the styling, giving you a clean slate to design them however you'd like.

A fully-managed, renderless dialog component jam-packed with accessibility and keyboard features, perfect for building completely custom dialogs and alerts.

Popovers are perfect for floating panels with arbitrary content like navigation menus, mobile menus and flyout menus.

Switches are a pleasant interface for toggling a value between two states, and offer the same semantics and keyboard navigation as native checkbox elements.

Easily create accessible, fully customizable tab interfaces, with robust focus management and keyboard navigation support.

A vertically stacked set of interactive headings that each reveal an associated section of content.

A modal dialog that interrupts the user with important content and expects a response.

A control that allows the user to toggle between checked and not checked.

A window overlaid on either the primary window or another dialog window, rendering the content underneath inert.