<!--
{
  "availability" : [
    "iOS: 14.0.0 -",
    "iPadOS: 14.0.0 -",
    "macCatalyst: 14.0.0 -",
    "macOS: 11.0.0 -",
    "visionOS: 1.0.0 -"
  ],
  "documentType" : "symbol",
  "framework" : "SwiftUI",
  "identifier" : "/documentation/SwiftUI/ColorPicker",
  "metadataVersion" : "0.1.0",
  "role" : "Structure",
  "symbol" : {
    "kind" : "Structure",
    "modules" : [
      "SwiftUI"
    ],
    "preciseIdentifier" : "s:7SwiftUI11ColorPickerV"
  },
  "title" : "ColorPicker"
}
-->

# ColorPicker

A control used to select a color from the system color picker UI.

```
nonisolated struct ColorPicker<Label> where Label : View
```

## Overview

The color picker shows the currently selected
color and displays the larger system color picker that allows people to
select a new color.

By default color picker supports colors with opacity; to disable opacity
support, set the `supportsOpacity` parameter to `false`.
In this mode the color picker won’t show controls for adjusting the opacity
of the selected color, and strips out opacity from any color set
programmatically or selected from the user’s system favorites.

You use `ColorPicker` by embedding it inside a view hierarchy and
initializing it with a title string and a [`Binding`](/documentation/SwiftUI/Binding) to a [`Color`](/documentation/SwiftUI/Color):

```
struct FormattingControls: View {
    @State private var bgColor =
        Color(.sRGB, red: 0.98, green: 0.9, blue: 0.2)

    var body: some View {
        VStack {
            ColorPicker("Alignment Guides", selection: $bgColor)
        }
    }
}
```

## Topics

### Creating a color picker

[`init(_:selection:supportsOpacity:)`](/documentation/SwiftUI/ColorPicker/init(_:selection:supportsOpacity:))

Creates a color picker with a text label generated from a title string
resource.

[`init(selection:supportsOpacity:label:)`](/documentation/SwiftUI/ColorPicker/init(selection:supportsOpacity:label:))

Creates an instance that selects a color.



---

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)