12 of 56
Colors & patterns
A shade and print library in the CMS — exact color names, real patterns in swatches and filters by color family.
Why it matters
In fashion, color is one of the main reasons to buy — and one of the main reasons to send something back. A shopper picks "beige" and receives a shade with a pink undertone; a print looked like a fine pinstripe in the photo and turns out to be a bold stripe. When a color is labeled "Beige 2" or shown as a flat averaged dot, expectations drift away from reality before the parcel even ships.
A color and pattern library turns color into part of your brand rather than a technical tag: every shade gets an exact name, a sample and a place in the filters.
How it drives sales
- Fewer "wrong shade" returns. "Milk", "Graphite" and "Terracotta" instead of "White-1" and "Dk grey" — shoppers know exactly what they're ordering and are less likely to be disappointed when they unpack it.
- Prints are visible at a glance. Stripes, gingham, leopard, polka dots or florals appear as the actual pattern inside the swatch — no need to open every photo to tell the options apart.
- Filters that make sense. You may stock dozens of shades, but in the filters they read as five or six clear families. "White" finds both milk and ivory, and the "Stripe" pattern pulls up every striped piece at once.
- A polished storefront. Swatches look the same in the catalog, on the product page and in quick view — one palette, one set of names, no visual noise.
How it works
- Your team maintains the library in the CMS: customer-facing name, HEX sample (typed in or picked with the eyedropper), color family for filters and display order.
- For prints, you choose a pattern instead of a color: the motif plus two colors — base and print. For two-tone styles the swatch is split into two halves.
- On the product, the color is picked from the library and flows straight into the variants with their photos, prices and stock.
- On the storefront, swatches appear under every product: hover or tap switches the photo to the selected color.
- Tweak a shade or pattern in the library and swatches update across the whole store — no editing individual products.
CMS settings
| Field | Example |
|---|---|
| Customer-facing name | Milk, Graphite, Terracotta |
| Sample | HEX #F3EEE4, eyedropper or a ready-made pattern |
| Color family | Milk, cream, ivory → "White" |
| Pattern | Stripe, gingham, leopard, polka dot, floral |
| Two-tone | Black + milk — a swatch split into two halves |
| Order | How shades line up on the product page and in filters |
Fashion nuances
- Names are part of your brand voice. The same "beige" piece might be called "Sand", "Camel" or "Oat" — the library keeps your vocabulary and stops it from drifting across hundreds of products.
- Families for searching, names for choosing. Shoppers filter by a familiar "White" and see the precise "Ivory" on the product page — and understand how it differs from milk.
- One library for every collection. A new season reuses the shades you already have, so the storefront stays recognizable from one collection to the next.