Skip to content Skip to footer navigation
You are reading the Statamic 6 Alpha docs. đź‘€

All UI Components

Type Description
Badge

Highlight contextual information, like status, count, or related data. You can pass text through a text prop or use it like an HTML tag pair.

Button

Buttons are used to trigger actions. They come in many sizes and flavors.

Calendar

We'll give you 3 guesses what this is for.

Card

The ubiquitous container of all elements! The div of any component system. Cards can contain anything you want – content, widgets, settings, forms, you name it.

Checkbox

Checkboxes are used to select multiple options from a list of options.

Datepicker

Pick some dates! Also, times, if you want.

Dropdown

Displays a menu to the user—such as a set of actions or functions—triggered by a button, with full keyboard navigation support.

Heading

Clean and consistent headings and subheadings.

Icon

You may use many icons from the streamline icon set.

Input

The classic form text input.

Modal

Display content in a layer above the main page. Ideal for confirmations, alerts, and forms.

Popover

Display rich content in a portal, triggered by a button.

Radio

Radio buttons are used to select a single option from a list of options.

Select

Displays a list of options for the user to pick from—triggered by an input style button.

Separator

Clean and consistent visual separators for content sections.

Splitter

Splitter is a component that allows you to split content into multiple, resizable panes.

Switch
Table
Tabs
Textarea
Tooltip