Skip to main content

Components

Components are the reusable building blocks of the Naos Design System. Each one documents its anatomy, behavior, usage guidelines, and accessibility so teams can build consistent, high-quality experiences.

Actions

Elements that let users trigger actions and navigate.

  • Button - Primary, secondary, and tertiary actions
  • Stacked Button - Grouped related actions in a single control
  • Link - Inline and standalone navigation

Forms & Inputs

Controls for collecting user input.

  • Input - Text, number, date, and other field types
  • Checkbox - Select one or more options
  • Radio Button - Select a single option from a set
  • Search - Find content quickly

Overlays & Feedback

Surfaces that appear above the page and communicate system state.

  • Modal Dialog - Focused tasks and confirmations
  • Side Modal - Contextual panels alongside content
  • Popover - Lightweight contextual content
  • Alert - Prominent, contextual messages
  • Snackbar - Brief, transient feedback

Data Display

Components for presenting content and data.

  • Data Table - Structured, sortable, interactive data
  • List - Ordered and unordered collections
  • Pagination - Navigate through paged content
  • Avatar - Represent people and entities
  • Chip - Compact, dismissible items and filters

Components that organize and reveal content.


Browse the full list of components in the sidebar.