Xcode colour set generator
A named colour in Xcode is a <Name>.colorset folder with a Contents.json that lists one entry per appearance: Any, Dark, and optional High Contrast versions. Type your colours below as hex, rgb() or hsl(), add the variants you need, and download a ready Assets.xcassets folder, with the Swift lines to use each colour and a contrast check for the pairs you mark.
1. Your colours
Hex, rgb(), hsl() or any CSS colour, or use the picker. Add an alpha value for a see-through colour.
The asset name you use in code, for example BrandBlue or Card Background.
The asset name you use in code, for example BrandBlue or Card Background.
2. Colour space and format
Colour space
The values you type are read as sRGB. With Display P3 they are converted so the colour looks the same, and the P3 numbers are shown below.
Components
The same choice as Xcode's Input Method menu. Xcode reads all three; floating point keeps three decimals.
3. Download and code
The ZIP holds an Assets.xcassets folder with one .colorset per colour. Drag the .colorset folders into your own catalog in Xcode's navigator, or add the whole folder to a target.
Assets.xcassets/BrandBlue.colorset
Swift · By name
// SwiftUI Color("BrandBlue") // UIKit UIColor(named: "BrandBlue") // AppKit NSColor(named: "BrandBlue")Generated symbols (Xcode 15 and later, iOS 17, macOS 14)
// SwiftUI Color(.brandBlue) // UIKit UIColor(resource: .brandBlue)
Contents.json
{ "colors" : [ { "color" : { "color-space" : "srgb", "components" : { "alpha" : "1.000", "blue" : "1.000", "green" : "0.424", "red" : "0.039" } }, "idiom" : "universal" }, { "appearances" : [ { "appearance" : "luminosity", "value" : "dark" } ], "color" : { "color-space" : "srgb", "components" : { "alpha" : "1.000", "blue" : "1.000", "green" : "0.608", "red" : "0.298" } }, "idiom" : "universal" } ], "info" : { "author" : "xcode", "version" : 1 } }Assets.xcassets/CardBackground.colorset
Swift · By name
// SwiftUI Color("CardBackground") // UIKit UIColor(named: "CardBackground") // AppKit NSColor(named: "CardBackground")Generated symbols (Xcode 15 and later, iOS 17, macOS 14)
// SwiftUI Color(.cardBackground) // UIKit UIColor(resource: .cardBackground)
Contents.json
{ "colors" : [ { "color" : { "color-space" : "srgb", "components" : { "alpha" : "1.000", "blue" : "1.000", "green" : "1.000", "red" : "1.000" } }, "idiom" : "universal" }, { "appearances" : [ { "appearance" : "luminosity", "value" : "dark" } ], "color" : { "color-space" : "srgb", "components" : { "alpha" : "1.000", "blue" : "0.118", "green" : "0.110", "red" : "0.110" } }, "idiom" : "universal" } ], "info" : { "author" : "xcode", "version" : 1 } }
Xcode turns the asset name into a Swift name: a trailing "Color" is dropped and the words are joined in lower camel case. These lines work when the target's Generate Asset Symbols build setting (ASSETCATALOG_COMPILER_GENERATE_ASSET_SYMBOLS) is on.
4. Contrast check
Mark the text and background colours you use together. Each pair is checked with the WCAG 2.x formula in light and dark, and in high contrast when either colour has a high contrast version. Where a colour has no version for a look, the system uses its normal one, and so does this check.
Ratio AA text AA large AA UI AAA text AAA large Light 4.56:1 pass pass pass fail pass Dark 6.03:1 pass pass pass fail pass
See-through backgrounds are put over white in light looks and black in dark looks; your real background may differ.
What Xcode reads
Checked against Xcode 27.1 and Apple's documentation on 2026-10-30.
- • Each colour is a folder named <Name>.colorset with a Contents.json. The catalog folder has its own Contents.json with only the info block.
- • Every variant is one entry in "colors" with idiom universal. Dark adds the appearance luminosity = dark; high contrast adds contrast = high; the high contrast dark entry has both.
- • "color-space" is srgb or display-p3. Red, green and blue are strings: "0.231", "59" or "0x3B". Alpha is always written like "1.000".
- • Xcode lists keys in alphabetical order with a space before each colon, and the files here do the same.
How it works
- •Each colour you add becomes one .colorset folder. Its Contents.json has an entry for Any, and one for Dark, High Contrast and High Contrast Dark when you turn those on, in the order Xcode lists them.
- •The JSON layout matches files written by Xcode byte for byte: keys in alphabetical order, a space before each colon, components as strings, alpha with three decimals.
- •With Display P3 chosen, your sRGB values are converted through CIE XYZ so the colour looks the same, and the P3 numbers are shown next to the sRGB ones.
- •The Swift names come from the same rules Xcode uses for generated asset symbols. They were compared with the names actool writes, including a trailing "Color", numbers, capitals and Swift keywords.
- •Every combination of colour space and format was compiled with Apple's actool for iOS 17 and macOS 14 with no warnings or errors, and assetutil showed each colour and appearance in the compiled Assets.car.
- •Nothing is uploaded: reading the colours, building the JSON and the ZIP all happen in your browser.
What it does not do
- •It does not read or change an existing Xcode project or catalog. You add the downloaded .colorset folders yourself.
- •It does not take Display P3 values as input. Values are read as sRGB; a colour that only exists in P3 has to be set in Xcode's colour panel.
- •It writes universal colours only: no separate iPhone, iPad, Mac, watch or TV versions, no gamut-specific entries and no system colour references.
- •The contrast check uses the WCAG 2.x formula on the sRGB values. It does not model vibrancy, materials or what sits behind a see-through colour in your real layout.
- •The JSON format and Swift names were checked against Xcode 27.1 on 2026-10-30. Apple can change them in a later Xcode.
Questions
- What is inside a .colorset Contents.json?
- A "colors" array with one entry per variant and an "info" block (author xcode, version 1). Each entry has idiom universal, a color with "color-space" and "components" (red, green, blue and alpha as strings), and for variants an "appearances" list such as luminosity = dark or contrast = high.
- How do I add a dark mode colour in Xcode?
- Select the colour set, open the Attributes inspector and set Appearances to Any, Dark. Xcode then adds a second entry with the luminosity = dark appearance. This page writes that entry for you when you turn on Dark appearance, and iOS or macOS picks it whenever the interface is dark.
- Should I use sRGB or Display P3?
- sRGB is the safe default and matches web and design-tool hex values. Display P3 can show more saturated colours on recent iPhones, iPads and Macs. Converting an sRGB colour to P3 keeps its look; it only becomes more vivid if you pick values outside sRGB in Xcode.
- What are Increase Contrast colours for?
- When someone turns on Increase Contrast in Accessibility settings, the system uses the colour's high contrast version if it has one. Use it to darken text or strengthen borders that only just pass. Without one, the normal colour is used.
- How do I use the colour in Swift?
- By name: Color("BrandBlue") in SwiftUI, UIColor(named: "BrandBlue") in UIKit, NSColor(named: "BrandBlue") in AppKit. With Xcode 15 and later, generated symbols let you write Color(.brandBlue) or UIColor(resource: .brandBlue), which the compiler checks. Apple lists the ColorResource type for iOS 17 and macOS 14 and later.
- Why is my generated Swift name different from the asset name?
- Xcode turns asset names into lower camel case and drops a trailing "Color": AccentColor becomes accent and card-background becomes cardBackground. A name in capitals stays in capitals, a leading digit gets an underscore, and two assets that end up with the same Swift name keep only one symbol.