What is Color Categories?

Color Categories is a collection of colors that can be an alternative for a color of a text layer. Your customers can pick a color from it to change color of a text layer of your design on the storefront.

Here is an example of a color category:

Then on live store, you can show this category for customers to pick in order to change the color of a text layer:

Create a Color Category

• Go to Color Categories page under the "Assets" menu
• Click on New Category button

• Type a Name for this new category and hit on the Create button

Add Colors to a category

• To add a color to this category, you can **enter the color hex **on the text box or choose a color from the color picker. Then hit the Add new button

Edit Colors in a category

• After adding colors, by default, the display options on personalization form will be **Thumbnail images. **
• Click on color option's name to edit (by default, color option's name = the color hex you added)

Name of colors will be displayed on storefront if you choose the Display Settings as Dropdown Option Name or enable the Show option name on hover toggle

• Click on the X button to delete a color
• To re-order color options, hold the blank space on a row and drag it to the correct position.

Use Color Categories in Artwork 2.0

In Artwork 2.0, add a standalone Color layer to the personalization form, then populate its selected color into a supported layer, such as a Text layer.

Add a Color layer

1. Open the Artwork editor.
2. Select + Layer.
3. Under Form Elements, select Color.

Configure the Color option

You can reuse an existing Global Option or create a new option for this artwork.

Reuse an existing Global Option

1. In the Color layer's Personalization Settings, select Use an existing global option.
2. Under Select a global option, choose the Color Global Option you previously created.

Create a new Color option

1. In the Color layer's Personalization Settings, select Create a new option.
2. Enter an Option Title. This title is displayed on the personalization form.
3. Under Color options, select Solid Color category.
4. Under Select one color category, choose the Color Category you created earlier.

Apply the selected color to another layer

1. Open the layer whose color customers should be able to change, such as a Text layer.
2. Expand Populate Values.
3. Enable Populate Color from another option.
4. Under Select a Color option, choose the Color layer you added.
5. Keep the populated value as {{color}}.

Verify the result

1. Preview or launch a campaign that uses this artwork.
2. On the storefront, select a color from the personalization form.
3. Confirm that the selected color is applied to the connected layer in the preview.

Expected result: Customers can select a color from the Color Category, and the connected layer updates to that color.

Updated on: 26/08/2026