Widget catalog

The widget catalog is the fastest way to survey what the public widget surface already covers.

Do not treat it as a tutorial. Its job is to help you choose the right family of widgets and then jump to the dedicated page for the exact widget or supporting type you need.

A good rule is to choose by job first.

If you are shaping space, start with layout. If you are collecting user intent, start with inputs. If you are rendering information-heavy screens, start with display and data. If the feature needs layered interface, routing, or overlays, start with overlays and navigation. If the feature needs host-backed or custom surfaces, start with media.

Layout and structure

These widgets determine how space is allocated and how children are arranged before you worry about product-specific details.

Widget	Dedicated page	Typical use
Container	Container	Constraint, padding, size, and background wrapper for one child
Row	Row	Horizontal arrangement of children
Column	Column	Vertical arrangement of children
Scroll	Scroll	Scrollable region when content may exceed the viewport
Spacer	Spacer	Fixed or flexible empty space
Grid	Grid	Matrix-style layout container
GridItem	GridItem	Child placement and span control inside a grid
ZStack	ZStack	Layered children in the same visual region
Positioned	Positioned	Explicit placement inside layered layouts
Align	Align	Child alignment inside available space
Center	Center	Simple centered layout helper
HStack	HStack	Higher-level horizontal stack helper
VStack	VStack	Higher-level vertical stack helper
Wrap	Wrap	Multi-line wrapping layout for repeated content
SimpleGrid	SimpleGrid	Higher-level grid helper
SplitView	SplitView	Resizable split-pane layout
SplitDirection	SplitDirection	Split orientation support type
AspectRatio	AspectRatio	Preserve width-to-height ratio
SafeArea	SafeArea	Respect window or device insets
LayoutBuilder	LayoutBuilder	Build based on current layout constraints
absolute_fill(...)	absolute_fill	Fill the available stacked bounds
Clip	Clip	Clip child drawing to a shape or bounds
Transform	Transform	Visual transformation wrapper
Composite	Composite	Composition and repaint-boundary helper
FocusScope	FocusScope	Focus-boundary grouping for keyboard traversal

For a family-level overview, continue to Layout widgets.

Inputs and editing

These widgets collect intent, edit values, or wrap input flows.

Widget	Dedicated page	Typical use
Button	Button	Primary click or tap action
ButtonVariant	ButtonVariant	Button style selection support type
ButtonContentAlign	ButtonContentAlign	Button content alignment support type
Checkbox	Checkbox	Boolean choice with visible checked state
Radio	Radio	Single selection inside a group
Switch	Switch	On or off toggle with switch affordance
Slider	Slider	Continuous value selection
RangeSlider	RangeSlider	Two-handle continuous range selection
TextInput	TextInput	Single-line or multiline text entry surface
NumberInput	NumberInput	Numeric entry with increment or decrement patterns
Select	Select	Closed set choice control
SelectItem	SelectItem	Option type for Select
Combobox	Combobox	Text input plus suggestion selection
SegmentedControl	SegmentedControl	Small mutually exclusive option group
DatePicker	DatePicker	Date selection surface
DateRangePicker	DateRangePicker	Date range selection surface
TimePicker	TimePicker	Time-of-day selection surface
Editable	Editable	Lower-level editable wrapper
GestureDetector	GestureDetector	Manual gesture-driven intent capture
Draggable	Draggable	Draggable source surface
DragTarget	DragTarget	Drop acceptance target
Dropzone	Dropzone	File or payload drop region
FileUpload	FileUpload	Upload-oriented input wrapper
FormControl	FormControl	Label, helper, and validation wrapper
DropDown	DropDown	Dropdown wrapper and helper surface

For the family-level explanation, see Input widgets.

Display and data

These widgets present information once layout and state flow are already clear.

Widget	Dedicated page	Typical use
Text	Text	Basic text display
TextContent	TextContent	Literal or keyed text content support type
RichText	RichText	Mixed-style text content
RichTextRun	RichTextRun	Segment inside rich text
TextRunStyle	TextRunStyle	Rich-text style support type
TextFontStyle	TextFontStyle	Text style support type
Icon	Icon	Iconographic display element
Avatar	Avatar	User or entity identity surface
Badge	Badge	Small status indicator
Tag	Tag	Labeled categorical chip
Link	Link	Hyperlink-style display and action surface
Code	Code	Inline or block code presentation
Kbd	Kbd	Keyboard shortcut presentation
Card	Card	Framed information container
Divider	Divider	Visual separation line
Alert	Alert	Prominent inline message surface
AlertKind	AlertKind	Alert style support type
EmptyState	EmptyState	"Nothing here yet" presentation
ProgressBar	ProgressBar	Linear progress display
CircularProgress	CircularProgress	Circular progress display
Spinner	Spinner	Indeterminate loading motion
Skeleton	Skeleton	Placeholder loading layout
Stat	Stat	Labeled metric display
Stepper	Stepper	Step-by-step process indicator
Calendar	Calendar	Calendar grid display
DataTable	DataTable	Tabular data presentation
TableColumn	TableColumn	Column definition for DataTable
TableRow	TableRow	Row definition for DataTable
Timeline	Timeline	Chronological sequence display
TimelineItem	TimelineItem	Entry inside a timeline
TreeView	TreeView	Hierarchical data presentation
TreeItem	TreeItem	Entry inside a tree view

For the family-level explanation, see Display and data widgets.

Overlays and navigation

These widgets handle layered interface, routing, menus, and movement between sections of the app.

Widget	Dedicated page	Typical use
Modal	Modal	Blocking dialog overlay
ModalAction	ModalAction	Footer action support type for modals
Popover	Popover	Anchored floating panel
Drawer	Drawer	Sliding side panel
DrawerSide	DrawerSide	Drawer side selection support type
Tooltip	Tooltip	Small explanatory overlay
Toast	Toast	Temporary notification overlay
ToastKind	ToastKind	Toast style support type
Portal	Portal	Low-level portal registration widget
flyout(...)	flyout	Flyout overlay helper
Menu	Menu	Menu surface
MenuButton	MenuButton	Button that opens a menu
MenuItem	MenuItem	Entry inside a menu
Tabs	Tabs	Tabbed navigation surface
TabItem	TabItem	Tab definition
Accordion	Accordion	Expandable section group
AccordionItem	AccordionItem	One accordion entry
Breadcrumb	Breadcrumb	Hierarchical navigation trail
BreadcrumbItem	BreadcrumbItem	One breadcrumb entry
Pagination	Pagination	Page-by-page navigation
Route	Route	Route definition
RouteParams	RouteParams	Route parameter access type
Router	Router	Route selection widget
Hero	Hero	Shared-element transition surface
Transition	Transition	Animation-oriented transition wrapper

For the family-level explanation, see Overlays and navigation.

Media and custom surfaces

These widgets and helper types cover image, video, host-backed embeds, terminal surfaces, and custom drawing entry points.

Widget or helper	Dedicated page	Typical use
Image	Image	Static raster image display
Video	Video	Video playback surface
WebView	WebView	Embedded web content surface
TerminalView	TerminalView	Interactive terminal surface
TerminalLaunchConfig	TerminalLaunchConfig	Terminal startup configuration
TerminalSession	TerminalSession	Terminal session handle
canvas(...)	canvas	Lightweight custom drawing helper
CanvasLowerer	CanvasLowerer	Lowering helper behind canvas(...)
CustomNode	CustomNode	Custom authored node with lowerer or render object
Node	Node	The erased authored node type
Builder	Builder	Core authoring builder helper

For the family-level explanation, see Media.