# Component Overview

<CardList>

[![Accordion - Display a collapsible list](./../_assets/components/accordion.svg)](./accordion.md)
[![Action Button - Trigger an action](./../_assets/components/action_button.svg)](./action_button.md)
[![Action Group - Group actions together](./../_assets/components/action_group.svg)](./action_group.md)
[![Action Menu - Display a menu of actions](./../_assets/components/action_menu.svg)](./action_menu.md)
[![Avatar - Display a user's profile picture](./../_assets/components/avatar.svg)](./avatar.md)
[![Badge - Display a small piece of information](./../_assets/components/badge.svg)](./badge.md)
[![Breadcrumbs - Show a navigation hierarchy](./../_assets/components/breadcrumbs.svg)](./breadcrumbs.md)
[![Button - Trigger an important action](./../_assets/components/button.svg)](./button.md)
[![Button Group - Group buttons together](./../_assets/components/button_group.svg)](./button_group.md)
[![Calendar - Display a calendar](./../_assets/components/calendar.svg)](./calendar.md)
[![Checkbox - Allow users to select option](./../_assets/components/checkbox.svg)](./checkbox.md)
[![Checkbox Group - Select from a group of checkboxes](./../_assets/components/checkbox_group.svg)](./checkbox_group.md)
[![Color Picker - Select a color](./../_assets/components/color_picker.svg)](./color_picker.md)
[![Combo Box - Select an option from a list](./../_assets/components/combo_box.svg)](./combo_box.md)
[![Contextual Help - Provide additional information](./../_assets/components/contextual_help.svg)](./contextual_help.md)
[![Dashboard - Display a collection of widgets](./../_assets/components/dashboard.svg)](./dashboard.md)
[![Date Field - Select a date](./../_assets/components/date_field.svg)](./date_field.md)
[![Date Picker - Select a date from a calendar](./../_assets/components/date_picker.svg)](./date_picker.md)
[![Date Range Picker - Select a range of dates](./../_assets/components/date_range_picker.svg)](./date_range_picker.md)
[![Dialog - Display a modal dialog](./../_assets/components/dialog.svg)](./dialog.md)
[![Dialog Trigger - Trigger open a dialog](./../_assets/components/dialog_trigger.svg)](./dialog_trigger.md)
[![Disclosure - Show or hide content](./../_assets/components/disclosure.svg)](./disclosure.md)
[![Divider - Separate content](./../_assets/components/divider.svg)](./divider.md)
[![Flex - Create flexible layouts](./../_assets/components/flex.svg)](./flex.md)
[![Form - Create a form](./../_assets/components/form.svg)](./form.md)
[![Fragment - Group elements together](./../_assets/components/fragment.svg)](./fragment.md)
[![Grid - Create a grid layout](./../_assets/components/grid.svg)](./grid.md)
[![Heading - Display a heading](./../_assets/components/heading.svg)](./heading.md)
[![HTML - Embed HTML content](./../_assets/components/html.svg)](./html.md)
[![Icon - Display an icon](./../_assets/components/icon.svg)](./icon.md)
[![Illustrated Message - Display a message with an illustration](./../_assets/components/illustrated_message.svg)](./illustrated_message.md)
[![Image - Display an image](./../_assets/components/image.svg)](./image.md)
[![Inline Alert - Display an alert message](./../_assets/components/inline_alert.svg)](./inline_alert.md)
[![Labeled Value - Display a labeled value](./../_assets/components/labeled_value.svg)](./labeled_value.md)
[![Link - Create a hyperlink](./../_assets/components/link.svg)](./link.md)
[![List View - Display a list of items](./../_assets/components/list_view.svg)](./list_view.md)
[![Logic Button - Trigger a logic action](./../_assets/components/logic_button.svg)](./logic_button.md)
[![Markdown - Render Markdown content](./../_assets/components/markdown.svg)](./markdown.md)
[![Menu - Display a menu of options](./../_assets/components/menu.svg)](./menu.md)
[![Menu Trigger - Open a menu](./../_assets/components/menu_trigger.svg)](./menu_trigger.md)
[![Meter - Display a progress meter](./../_assets/components/meter.svg)](./meter.md)
[![Number Field - Enter a number](./../_assets/components/number_field.svg)](./number_field.md)
[![Panel - Display a panel](./../_assets/components/panel.svg)](./panel.md)
[![Picker - Select an item from a list](./../_assets/components/picker.svg)](./picker.md)
[![Progress Bar - Display a progress bar](./../_assets/components/progress_bar.svg)](./progress_bar.md)
[![Progress Circle - Display a progress circle](./../_assets/components/progress_circle.svg)](./progress_circle.md)
[![Radio Group - Select from a group of radio buttons](./../_assets/components/radio_group.svg)](./radio_group.md)
[![Range Calendar - Select a range of dates](./../_assets/components/range_calendar.svg)](./range_calendar.md)
[![Range Slider - Select a range of values](./../_assets/components/range_slider.svg)](./range_slider.md)
[![Search Field - Search for an item](./../_assets/components/search_field.svg)](./search_field.md)
[![Slider - Select a value from a range](./../_assets/components/slider.svg)](./slider.md)
[![Switch - Toggle a setting](./../_assets/components/switch.svg)](./switch.md)
[![Table - Display tabular data](./../_assets/components/table.svg)](./table.md)
[![Tabs - Display a set of tabs](./../_assets/components/tabs.svg)](./tabs.md)
[![Tag Group - Group tags together](./../_assets/components/tag_group.svg)](./tag_group.md)
[![Text - Display text](./../_assets/components/text.svg)](./text.md)
[![Text Area - Enter multi-line text](./../_assets/components/text_area.svg)](./text_area.md)
[![Text Field - Enter single-line text](./../_assets/components/text_field.svg)](./text_field.md)
[![Time Field - Select a time](./../_assets/components/time_field.svg)](./time_field.md)
[![Toast - Display a temporary message](./../_assets/components/toast.svg)](./toast.md)
[![Toggle Button - Toggle a setting](./../_assets/components/toggle_button.svg)](./toggle_button.md)
[![View - Display a view](./../_assets/components/view.svg)](./view.md)

</CardList>