Components

Displays a button or a component that looks like a button.

Displays a form input field.

Displays a multi-line text input field.

Renders an accessible label associated with controls.

Displays a list of options for the user to pick from.

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

A set of checkable buttons where only one can be checked at a time.

A control that allows the user to toggle between on and off.

An input where the user selects a value from within a given range.

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

A set of toggle buttons that can work together.

A date field component that allows users to select dates.

A date picker built with Calendar and Popover.

An image element with a fallback for user profiles.

Displays a badge or a component that looks like a badge.

Displays a card with header, content, and footer.

Beautiful charts built with Recharts. Area, bar, line, pie, radar, and radial.

A responsive table component.

Used to show a placeholder while content is loading.

Visually separates content.

For sighted users to preview content behind a link.

Displays a callout for user attention.

A modal dialog that interrupts the user.

Displays rich content in a portal triggered by a button.

A succinct message that is displayed temporarily.

A popup that displays information related to an element.

Displays an indicator showing the completion progress of a task.

Fast, composable command menu for search and actions.

Displays a menu to the user.

A set of layered sections of content.

A vertically stacked set of interactive headings.

An interactive component which expands and collapses.

A panel that slides out from the side of the screen.

Augments native scroll functionality for custom styling.

Interactive Mapbox map for visualizing energy site locations.

React Flow diagram showing real-time energy distribution.

Conversational AI interface for energy system management.