EStore Tools

WooCommerce Color Swatch Generator

Turn a list of color names into hex values for WooCommerce's native color attribute type, ready to paste into each term.

Describe the result you need. AI will set up the tool and ask for any missing details.

Configure with AI

Enter to submit · Shift + Enter for a new line

Sent to AI. Leave out passwords and private customer data.

Your details

Term name → hex value

woocommerce-color-terms.csv
Term name,Hex value
Black,#000000
White,#FFFFFF
Navy,#000080
Heather Gray,#9A9A9A
Forest Green,#228B22
Blush,#DE5D83
Mustard,#FFDB58
Burgundy,#800020

8 of 8 names matched a standard hex value. Check every one against your own brand colors before you use it.

WooCommerce's built-in color swatches

WooCommerce added a native color/image attribute type to core, no plugin required. It's an experimental feature, off by default: turn it on at WooCommerce → Settings → Advanced → Features → “Color swatches for attributes.” The toggle only shows up on a block theme; classic themes don't list it.

Once it's on, set a global attribute's Type to Color / image under Products → Attributes, then open Configure terms for that attribute and enter a hex value for each term. This tool doesn't set the hex values for you automatically (WooCommerce's product CSV import doesn't carry term hex codes); it just matches your color names to standard hex values so you can paste them in quickly.

Default color list

Navy
#000080
Blush
#DE5D83

All 8 of the default names matched a standard hex value in this example.

Setting it up

  1. 01

    Turn the feature on

    WooCommerce → Settings → Advanced → Features → “Color swatches for attributes.”

  2. 02

    Set the attribute type

    Products → Attributes, edit (or add) your Color attribute, and set its Type to Color / image.

  3. 03

    Enter the hex values

    Open Configure terms for that attribute. For each term (Black, Navy, and so on), paste in the hex value this tool found.

Pitfalls

  • This is an experimental feature and only appears on block themes. If you're on a classic theme, you won't see the toggle.
  • The hex values here are standard reference shades (for example, a generic “Navy”), not your brand's exact color. Check each one before you publish.
  • A name it can't match (an unusual or brand-specific color name) is left with a blank hex value, flagged in the notes, for you to fill in by hand.

Questions people ask

Do I need a plugin for color swatches on WooCommerce?

No. WooCommerce added a native color/image attribute type to core. It's still experimental, so it has to be turned on under WooCommerce → Settings → Advanced → Features.

Why don't I see the “Color swatches” toggle?

It only appears when your store is using a block theme. Classic themes don't list it yet.

Can I use images instead of solid colors?

Yes. The same “Color / image” attribute type also accepts an image per term, useful for patterns or textures, not just flat colors.

What if my color name isn't recognized?

It's still included in the output with a blank hex value. Look up the shade you want and fill it in by hand, or edit the name to a more common one and try again.

Related tools

WooCommerce Sample Data GeneratorGenerate realistic dummy products in a niche of your choice as a ready-to-import WooCommerce CSV, for staging sites and theme demos.WooCommerce Product Type PickerAnswer a few quick questions and get the right WooCommerce product type: simple, variable, grouped, or external, plus how to set it up.Excel to WooCommerce CSV MapperTurn a supplier's spreadsheet into a WooCommerce import file: names, SKUs and prices are matched automatically, then marked up and rounded.WooCommerce Product CSV Template GeneratorPick your product types and columns, and get a correctly headed WooCommerce import CSV with example rows and notes for every column.

Want this builtinto your store?

I'm Emmanuel, a Shopify and WooCommerce developer. If this tool pointed at something you'd rather have fixed for you (a faster store, cleaner product data, a migration, a custom feature), send me a note.

Emmanuel Asika

Emmanuel Asika

Shopify & WooCommerce developer, Dublin

I build and fix online stores: new builds, migrations, speed, SEO and the custom bits apps can't do.

hello@emmanuelasika.com
See my work

Last reviewed 30 September 2026.

Sources: WooCommerce docs: Managing product taxonomies (color swatches)