Skip to main content
The #color command opens a color picker and adds your chosen color as a named color in your Xcode asset catalog. This is the only toolkit command that opens a color picker instead of a file picker.

What It Does

When you use #color, the AI:
  1. Takes the color you picked and adds it to your asset catalog (Assets.xcassets) as a named Color Set
  2. Names it based on your description (e.g., “BrandBlue”, “BackgroundGray”)
  3. Applies it wherever you specify in your app
Named colors in the asset catalog can be referenced throughout your SwiftUI code with Color("BrandBlue"), keeping your color palette consistent and easy to manage.

How It’s Different

Every other toolkit command opens a file picker to let you select a file from your Mac. #color is different — it opens the macOS color picker so you can choose an exact color visually, enter hex values, or sample colors from your screen.

How to Use

1

Type #color in the chat

Type # and select color from the toolkit popover.
2

Pick your color

The macOS color picker opens. Choose your color using the color wheel, sliders, hex input, or the eyedropper to sample from your screen.
3

Name and describe it

The color appears as an orange chip below the input. Tell the AI what to name the color and where to use it.
4

Send your message

Press Enter. The AI adds the named color to your asset catalog and applies it throughout your app.

Example Prompts

Name this 'BrandBlue' and use it for all primary buttons
This is 'BackgroundGray', use it for the app's main background
Name this 'AccentOrange' and apply it to the navigation bar
Call this 'ErrorRed' and use it for form validation messages
This is 'CardBackground' — apply it to all card views in the app

Why Use Named Colors?

Named colors in the asset catalog give you several advantages over hardcoded hex values:
ApproachFlexibilityDark mode supportReusability
Hardcoded hexMust find and replace everywhereManualLow
Named color (asset catalog)Change once, updates everywhereBuilt-inHigh
Adding colors to the asset catalog means they automatically support light and dark mode when you configure both variants. You can ask the AI to set up a dark mode variant for any named color.

Building a Color Palette

You can use #color multiple times to build out your app’s full color palette. A typical app might include:
  • Primary — your main brand color for buttons and key actions
  • Secondary — a supporting color for less prominent elements
  • Background — the app’s base background color
  • Surface — card and container backgrounds
  • Text — primary text color
  • TextSecondary — secondary/muted text color
  • Accent — a highlight color for special elements
  • Error — for error states and validation messages
You can attach multiple colors in a single message. Pick each color, give it a name, and describe where to use it. The AI will add all of them to your asset catalog at once.

Toolkit Overview

See all available # commands and how the toolkit works.

Appearance

Learn about theming, dark mode, and visual customization.