Skip to content

Skip to Content

Components Landing Introduction

Registry Themes

Blocks All blocks Dashboard Dashboard 01 Sign in Dashboard management Profile settings Kanban board Tasks Data table Calendar Settings dialog Notifications Command centre Pipeline File manager Email inbox Conversations Sidebar Desktop

Accordion Alert Aspect ratio Auth Auto height Avatar Avatar group Badge Breadcrumb Bubble Button Calendar Card Carousel Chat Checkbox Code block Collapsible Color picker Color swatches Combobox Command menu Confirmation dialog Context menu Copy button Countdown Date picker Diagram Dialog Disclosure Drawer Dropdown menu EmptyState Field and inline validation Fieldset Form Highlight text Hotkey recorder Hover card Image zoom Inline edit Input group Inset group Item Kanban Keyboard shortcuts Knob List Mention input Message Message Scroller MultiStepForm Navigation menu Page transition Pagination Pinned list Popover Preview card Progress Reorderable tabs Reveal Search input Segmented control Select Separator Sheet Sidebar Skeleton Slider Spinner Stepper Switch Table Tabs Tag input Theme toggler Time picker Timeline Toast Toggle Toggle group Tooltip User menu

Examples API reference

Platform

Palette

Dark · macOS · Menlo

Blocks

Settings dialog

A modal settings window

Settings

PROFILES

PREFERENCES

ADMINISTRATION

Theme

Customize the look and feel of the application

Dark ModeUse the dark appearance across the application.

Font SizeSet the base size for text in the application.15px

AA

Message LayoutChoose how messages are grouped in a conversation.

Block source on GitHubapps/docs/src/components/docs/settings-dialog.tsx

Edit this page on GitHubapps/docs/content/docs/blocks/settings-dialog.mdx

Calendar

A month grid with the selected day's agenda beside it

Notifications

A notification centre with filters and grouped rows