# Colors

{% embed url="<https://salesiq.zohopublic.in/signaturesupport.ls?widgetcode=siq93f38201da244cbe219b2cab71813c85342abc57dd769c6885e2bde57d2b90da>" %}

You can use the theme settings to make changes to your online store's typography, colors, social media links, and checkout settings. When you make changes to your theme settings, the changes apply to your entire online store.

You can set primary and secondary color schemes for your online store.

From the Colors theme settings panel, you can set the context uses of the colors across the theme.

**Customize your color settings**

* From your Shopify admin, go to Online Store > Themes.
* Click on Customize button.
* Click Theme settings.
* Click Colors.
* To open the color picker, click the color swatch for the content type color you want to change. To set a specific hex color code, click on the text field to enter the color.
* Delete the hex code value from the text field to set the color to transparent.
* Click Save.

<table><thead><tr><th width="287">Setting</th><th>Description</th></tr></thead><tbody><tr><td>Primary colors</td><td><p><strong>Solid button label</strong>: </p><p>Sets the foreground color for solid buttons, used as the primary color for text within buttons across the theme.</p></td></tr><tr><td>Accent 1</td><td><strong>Body text</strong>: Color used for text within accent 1.<br><strong>Background</strong>: Color used for solid button background in accent 1.<br><strong>Gradient</strong>: Optional gradient effect.</td></tr><tr><td>Accent 2</td><td><strong>Body text</strong>: Color used for text within accent 2.<br><strong>Background</strong>: Color used for background in accent 2.<br><strong>Gradient</strong>: Optional gradient effect.</td></tr><tr><td>Accent 3</td><td><strong>Body text</strong>: Color used for text within accent 3.<br><strong>Background</strong>: Color used for background in accent 3.<br><strong>Gradient</strong>: Optional gradient effect.</td></tr><tr><td>Secondary colors</td><td><strong>Text</strong>: Used as the foreground color on background colors.<br><strong>Outline button</strong>: Color for button outlines, also used for text links.</td></tr><tr><td>Background 1</td><td><strong>Background 1</strong>: Sets the background color for Background 1 sections.<br><strong>Gradient</strong>: Optional gradient overlay for Background 1.</td></tr><tr><td>Background 2</td><td><strong>Background 2</strong>: Sets the background color for Background 2 sections.<br><strong>Gradient</strong>: Optional gradient overlay for Background 2.</td></tr><tr><td>Other</td><td><strong>Body text hover color</strong>: Sets the color of body text when hovered over.</td></tr></tbody></table>

<figure><img src="https://1291024468-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FZyN3AVm8eGZ8KfCXj2wM%2Fuploads%2Ffn9Z8ml6k4EFPyW0UO3Z%2Fcolors.png?alt=media&#x26;token=aca54257-a900-401b-82d2-d3d280b18f46" alt=""><figcaption></figcaption></figure>
