<!--
{
  "availability" : [
    "iOS: 15.0.0 -",
    "iPadOS: 15.0.0 -",
    "macCatalyst: 15.0.0 -",
    "macOS: 12.0.0 -",
    "visionOS: 1.0.0 -",
    "watchOS: 9.0.0 -"
  ],
  "documentType" : "symbol",
  "framework" : "SwiftUI",
  "identifier" : "/documentation/SwiftUI/ToggleStyle/button",
  "metadataVersion" : "0.1.0",
  "role" : "Type Property",
  "symbol" : {
    "kind" : "Type Property",
    "modules" : [
      "SwiftUI"
    ],
    "preciseIdentifier" : "s:7SwiftUI11ToggleStylePA2A06ButtoncD0VRszrlE6buttonAEvpZ"
  },
  "title" : "button"
}
-->

# button

A toggle style that displays as a button with its label as the title.

```
@export(implementation) nonisolated static var button: ButtonToggleStyle { get }
```

## Discussion

Apply this style to a [`Toggle`](/documentation/SwiftUI/Toggle) or to a view hierarchy that contains
toggles using the [`toggleStyle(_:)`](/documentation/SwiftUI/View/toggleStyle(_:)) modifier:

```
Toggle(isOn: $isFlagged) {
    Label("Flag", systemImage: "flag.fill")
}
.toggleStyle(.button)
```

The style produces a button with a label that describes the purpose
of the toggle. The user taps or clicks the button to change the
toggle’s state. The button indicates the `on` state by filling in the
background with its tint color. You can change the tint color using
the [`tint(_:)`](/documentation/SwiftUI/View/tint(_:)) modifier. SwiftUI uses this style as the
default for toggles that appear in a toolbar.

The following table shows the toggle in both the `off` and `on` states,
respectively:

|Platform   |Appearance                                                                                                                                                  |
|-----------|------------------------------------------------------------------------------------------------------------------------------------------------------------|
|iOS, iPadOS|![A screenshot of two buttons with a flag icon and the word flag inside. The first button isn’t highlighted; the second one is.](ToggleStyle-button-1-iOS)  |
|macOS      |![A screenshot of two buttons with a flag icon and the word flag inside. The first button isn’t highlighted; the second one is.](ToggleStyle-button-1-macOS)|

A [`Label`](/documentation/SwiftUI/Label) instance is a good choice for a button toggle’s label.
Based on the context, SwiftUI decides whether to display both the title
and icon, as in the example above, or just the icon, like when the
toggle appears in a toolbar. You can also control the label’s style
by adding a [`labelStyle(_:)`](/documentation/SwiftUI/View/labelStyle(_:)) modifier. In any case, SwiftUI
always uses the title to identify the control using VoiceOver.

---

Copyright &copy; 2026 Apple Inc. All rights reserved. | [Terms of Use](https://www.apple.com/legal/internet-services/terms/site.html) | [Privacy Policy](https://www.apple.com/privacy/privacy-policy)