Skip to main content
type AccessibilityTraits =
  | "isButton"
  | "isLink"
  | "isSearchField"
  | "isImage"
  | "isSelected"
  | "playsSound"
  | "isKeyboardKey"
  | "isStaticText"
  | "isSummaryElement"
  | "updatesFrequently"
  | "startsMediaSession"
  | "allowsDirectInteraction"
  | "causesPageTurn"
  | "isModal"
  | "isHeader";

​
Values

​
Element Type Traits

​
isButton
string
Indicates the element behaves like a button and can be activated.
​
isLink
string
Indicates the element is a link that navigates to another location or view.
​
isSearchField
string
Indicates the element is a search field where users can enter search queries.
​
isImage
string
Indicates the element is an image. Assistive technologies may describe it differently than other elements.
​
isKeyboardKey
string
Indicates the element represents a keyboard key.
​
isStaticText
string
Indicates the element contains static text that doesn’t change and isn’t interactive.
​
isHeader
string
Indicates the element is a header or heading that labels a section of content.

​
State Traits

​
isSelected
string
Indicates the element is currently selected. Used for items in lists, tabs, or other selectable components.
​
isSummaryElement
string
Indicates the element summarizes content when the app is inactive or minimized.
​
updatesFrequently
string
Indicates the element’s content updates frequently. Assistive technologies may poll it for changes.

​
Behavior Traits

​
playsSound
string
Indicates that interacting with the element will play a sound.
​
startsMediaSession
string
Indicates that activating the element will start a media playback session.
​
allowsDirectInteraction
string
Indicates the element allows direct touch interaction when using assistive technologies like VoiceOver.
​
causesPageTurn
string
Indicates that activating the element will cause a page turn in a paginated interface.
​
isModal
string
Indicates the element presents modal content that must be dismissed before interacting with other content.

​
Usage

// Add button trait to a custom interactive element
Rectangle()
  .fill(Color("blue"))
  .onTapGesture(() => { /* action */ })
  .accessibilityLabel("Custom Button")
  .accessibilityAddTraits("isButton")

// Mark a header
Text("Section Title")
  .font("headline")
  .accessibilityAddTraits("isHeader")

// Combine multiple traits
CustomControl()
  .accessibilityLabel("Play Music")
  .accessibilityAddTraits(["isButton", "startsMediaSession"])

// Remove default traits
Text("Non-selectable item")
  .accessibilityRemoveTraits("isSelected")

​
Notes

  • Multiple traits can be added to a single element using an array
  • Traits help assistive technologies like VoiceOver provide appropriate context and interaction patterns
  • Some components have default traits (e.g., Button automatically has isButton)
  • Use accessibilityAddTraits() to add traits and accessibilityRemoveTraits() to remove them
  • Proper trait usage significantly improves the accessibility of your application