My second color option won't show swatches, just plain text pills. Why?
If your first color option shows swatches but a second one, like trim or accent color, falls back to plain text pills, it's almost always a missing metafield link, not a bug.
What's going on
You set up color swatches on one product option and they look great: little colored circles or pattern thumbnails next to each variant name. But the moment a product needs a second color-type option, say Color for the main fabric and Trim Color or Accent for a second detail, that second option just shows plain rounded pills with the text value, no swatch in sight.
This trips people up because it looks like a theme bug, but it's usually a data or configuration gap. Shopify's built-in swatch rendering doesn't detect "color" from an option's name or position. It only shows swatches for option values that are linked to a metafield of type Color or Pattern, carrying an actual hex code, base color, or pattern image. If you only went through that linking step once, your first color option got the swatch treatment and the second one, left as ordinary text values, did not.
On top of that, plenty of themes, especially older or heavily customized ones, only look for an option literally named Color or Colour when deciding whether to render swatches at all, and have no logic to extend that to a second, differently named color option even when it is linked correctly.
Why it happens
Shopify's native swatch system is metafield-driven, not name-driven: an option only renders as a swatch if its values are connected to a Color or Pattern metafield definition carrying actual hex codes, base colors, or pattern images. A second color-like option added as plain text values has none of that data, so it falls back to the theme's default pill or dropdown style.
Many theme templates were also written assuming a product has exactly one color option. Their variant-picker code checks for an option named Color or Colour, or checks a single linked metafield, with no branch for a second, separately named color option, so even correctly linked data won't render as a swatch unless the theme was built to handle it.
4 ways to fix it
Confirm the second option's values are linked to a metafield, not just the first
Shopify's built-in swatch rendering isn't a style you turn on — it only appears for option values that are connected to a Color or Pattern metafield definition. Go to Settings, then Custom data, then Metafields (or the option-linking step when editing product options), and check whether your second color-type option was ever connected to that kind of definition the way the first one was. If it was left as a plain option with ordinary text values, that's why it falls back to pills — there's no swatch data attached to it.
Make sure each linked value actually has color or pattern data filled in
Linking the option only helps if the underlying entries have real data. When adding values to the second option, use the option to create or choose a linked entry rather than typing free text, then fill in a base color and hex code, or a pattern image, the same way you did for the first color option. A value that's technically linked but has no color or image data will still render as plain text.
Check whether your theme's variant picker supports more than one swatch group
Many current themes let you set how each product option is displayed (swatch, dropdown, or button/pill) in the theme editor's product page settings, usually per option. Some older or more customized themes only look for an option literally named Color and don't have logic to extend swatch rendering to a second, differently named color-type option, even when it's correctly linked. Check your theme's settings and documentation to see if it distinguishes between options at all.
If the theme won't extend swatches to a second option, customize it or use a swatches app
Some themes simply weren't built to render more than one swatch group per product. In that case the practical options are a Liquid customization to your theme's variant-picker code so it applies the same swatch logic to the second linked option, or a dedicated swatch app built to handle multiple color-type options out of the box. That gap is exactly what purpose-built swatch apps are meant to close when the native and theme-level path falls short.
Bottom line
Before reaching for an app, check whether the second option is actually linked to a Color or Pattern metafield with real color data filled in — that missing link is the most common reason a second option renders as pills. If your theme's code simply doesn't extend swatch rendering past one option, a small theme customization or a dedicated swatches app (the category of app BesPoP offers) is a reasonable fallback rather than a first resort.
Browse the rest of the problem library, run a free storefront scan to catch issues like this automatically, or email us and we'll work out a custom solution for it.