How can I add color swatches to product pages in the Dawn theme?

Store Design

Topic summary

Users are trying to add color swatches to product pages in Shopify’s Dawn theme but encounter missing settings. The expected “Products” section in theme settings doesn’t appear for many users, only “Product Card” which lacks swatch options.

Root Cause:
The color swatch feature was initially in beta and documentation was released before the actual functionality. Early access required Shopify Plus stores. The feature has since been integrated into Dawn 15+ but requires specific setup steps.

Working Solution (Dawn 15+):

  • Assign products to categories that support color metafields (e.g., “Clothing”)
  • Connect product variants to the category’s color metafield using the database icon
  • Configure swatch settings in theme customization
  • Custom color images can be uploaded instead of hex codes

Known Limitations:

  • Only one variant layer can connect to color metafields (workaround: use categories like “Furniture Electronics” that support multiple color attributes)
  • Mobile display issues reported with “+” numbers appearing next to swatches
  • Official Shopify documentation often doesn’t reflect the correct implementation process

Alternatives:
Several community members shared YouTube tutorials for custom coding solutions without apps. The discussion remains active with users troubleshooting specific implementation challenges.

Summarized with AI on November 1. AI used: claude-sonnet-4-5-20250929.
2

Hello @michellelholm

Here’s how to add color swatches to Shopify’s Dawn theme:

  1. Go to Shopify admin
  2. Click Online Store
  3. Click Themes
  4. Click Customize the Dawn theme
  5. Open the Theme Settings tab
  6. Open the Products section
  7. Set your product variant style to Swatches
  8. Select Show custom swatch images
  9. Click Save to apply the change

Please check the steps and let me know if you still face any issues?