New color_palette setting need to expose names

Online Store and Theme Development
1

Short description of issue

Colors in a theme’s color palette don’t expose names or labels.. neither in the color picker swatches nor in the palette settings themselves. Visually similar colors are impossible to tell apart reliably.

Reproduction steps

Add multiple colors to a color palette in the theme settings (e.g., two similar accent colors).

Open any color picker that references the palette.

The swatches appear without any name or label.. the only way to distinguish them is by eye.

Additional info

Our theme is built to be highly flexible, so we intentionally define visually similar colors with distinct semantic roles: a primary accent (badges, buttons, headlines) and a more subtle secondary accent (secondary buttons), as well as a bold text color alongside a subdued text color for supporting information. Since palette swatches carry no labels, it’s very easy to select or edit the wrong color. Telling similar swatches apart purely by appearance is unreliable the difference between them can be subtle, and the bright theme editor background makes low-contrast colors even harder to distinguish.
The current workaround is to create additional standalone color settings just to get a proper label, which defeats the purpose of the palette in the first place picking a palette color directly inside the component is far more convenient.
Suggested solution: Allow each palette color to have a name/label (e.g., “Accent – primary”, “Accent – subtle”, “Text – bold”, “Text – subdued”) that is

What type of topic is this

Feature request

2

Yes, this would be a very useful improvement.

For flexible themes, palette colors are often not just visual choices, they represent semantic roles.

For example, two colors may look almost identical but serve different purposes such as primary accent, subtle accent, bold text, or supporting text.

When the theme editor only shows unlabeled swatches, merchants and theme editors have to guess by eye, which becomes unreliable very quickly.

This also creates an accessibility and usability issue because low contrast colors can be difficult to distinguish inside the editor UI.

The current workaround of creating separate standalone color settings only for labels is not ideal because it duplicates settings and removes the benefit of using a shared palette.

A good solution would be to expose each palette color’s name in the editor, either as a tooltip, visible label, searchable label, or at least an accessible aria-label.

Something like this would be very helpful:

“Accent – primary”
“Accent – subtle”
“Text – bold”
“Text – subdued”

This would make color_palette much more practical for real production themes, especially themes with semantic design systems.