How to change the size for color swatch in product page

Store Design
, ,
1

How to change the size for color swatch circle in product page in DAWN theme

1 Like
2

Hi @NOT1 , please share your store URL. Thanks!

3

Hello @NOT1

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

@media screen and (min-width: 750px) { .product-form__input--swatch .swatch-input__input+.swatch-input__label { --swatch-input--size: 1.8rem !important; } }

Tech_Coding_0-1726130794843.png
Tech_Coding_0-1726130794843.png480×317 8.91 KB

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

4

Thanks

5

Hi @NOT1 ,

Step 1: Go to Shopify Admin → Online Store ->Theme → Edit code

Step 2: Search file theme.liquid

Step 3: Insert this code above tag:

Hope this can help you :heart_eyes:

6
  1. Go to Online Store → Theme → Edit code.
  2. Open your theme.liquid file
  3. In theme.liquid, paste the below code before

If my reply is helpful, kindly click like and mark it as an accepted solution.

Thanks!