Skip to content
segmented
AutoXXS (320px)XS (375px)SM (640px)MD (768px)LG (1024px)XL (1280px)XXL (1536px)
SketchMaterialiOSTamagui
DataInjectionKeyPatternsServiceTransactionProcessResearchProductQualityPerformanceSpecDomainFunctionTechnologyArchitectureConfigMiddlewareDataDatabaseDrizzleMigrationModelop-sqliteSchemaSQLState ManagementDraftKeystoneMergePatchPatchesPersistenceReactiveRedoStoreUndoTestingDeviceFactoryIsolationTypeScriptZodTopicsCommunicationBidsNVCDesignDesign ImplicationsEducationPedagogyFoundationsPsychologyAttachmentFloodingRelatingAuthentic RelatingUIEditorReact Native

segmented

Fragment reference segmented
tags
ui

A row of mutually exclusive buttons (segmented control).

Attributes

AttributeTypeDefaultDescription
optionsstring-Shorthand for comma-separated labels.
valuestring-Selected value in shorthand mode.

Can also contain segment children for icon support:

segmented
segment(label="Left" icon="align-left" active=true)
segment(label="Center" icon="align-center")
segment(label="Right" icon="align-right")