• Docs
  • Blog

    • 0.24.0

    • Switch to dark mode
    Get Started
    Components
    Styling
    Theming

    Concepts

    OverviewCompositionTesting

    Layout

    Aspect RatioBleedBoxCenterContainerDividerFlexFloatGridLink OverlayScrollableStackWrap

    Components

    AccordionAdmonitionAvatarButtonCarouselCheckboxClipboardCollapsibleComboboxConfirm ModalCTAModalDate PickerDialogFieldFieldsetFile UploaderIcon ButtonInputLoading StatesMenuNotificationsNumber InputPin InputProgressPrompt ModalRadioRatingSelectSplit ButtonSwitchTableTabsTagTextTextareaToggleTooltip

    Utilities

    Feature FlagsForLocal StoragePortalShowsplitPropsTheme

    Components

    Accessible and easy to use or customize UI components

    Categories

    Here are a list of the components available in this library, grouped by their functionality:

    Actions

    Components that trigger an action.

    • Button

      Buttons are used to trigger actions or events.

    • Icon Button

      Icon buttons are used to trigger actions or events.

    Communication

    Communication components provide useful information.

    • Admonition

      Admonitions are used to provide additional information or context.

    • Accordion

      Accordions are used to display collapsible content.

    • Avatar

      Avatars are used to represent users or entities.

    • Notifications

      Notifications are used to alert users of important information.

    • Progress Indicators

      Progress indicators are used to show the status of an ongoing process.

    • Tag

      Tags are used to categorize or label content.

    • Tooltip

      Tooltips are used to provide additional information.

    Containment

    Components that contain other components.

    • Confirm Modal

      Confirm modals are used to confirm an action.

    • Prompt Modal

      Prompt modals are used to collect user input.

    • CTA Modal

      CTA modals are used to promote a specific action.

    • Dialog

      Dialogs are used to display content on top of an overlay.

    • Table

      Tables are used to display data in a structured format.

    Navigation

    Components that help users navigate through the app.

    • Menu

      Menus are used to display a list of options.

    • Tabs

      Tabs are used to navigate between different sections.

    Selection

    Components that allow users to select choices.

    • Drag & Drop

      Drag & drop is used to move items between locations.

    • Checkbox

      Checkboxes are used to select multiple options.

    • Date Picker

      Date pickers are used to select a date.

    • Radio

      Radio buttons are used to select a single option.

    • Rating

      Ratings are used to provide feedback on a scale.

    • Select

      Selects are used to choose from a list of options.

    • Combobox

      Comboboxes are used to filter or select from a list.

    • Switch

      Switches are used to toggle between two states.

    Inputs

    Components that allow users to input data.

    • Field

      Fields are used to collect user input.

    • Input

      Inputs are used to collect user input.

    • Textarea

      Textareas are used to collect multi-line user input.

    • Label

      Labels are used to describe form inputs.

    • Fieldset

      Fieldsets are used to group related form inputs.

    • Field Message

      Field messages are used to provide feedback.

    • File Uploader

      File uploaders are used to upload files.

    On this page

    • Edit this page on Github
    Cerberus Design System | Docs