# Colors

**OVERVIEW**

You can customize colors by using the <mark style="color:orange;">**Color Selection Panel**</mark>, <mark style="color:orange;">**HEX Codes**</mark>, <mark style="color:orange;">**RGB Codes**</mark>, and <mark style="color:orange;">**Eye Dropper**</mark> selection.

<figure><img src="https://278174896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FpH7f7qBXjb57cdLvfyxr%2Fuploads%2FBslUkNVEYP0SFyIH6x22%2Fcolor_selection.jpg?alt=media&#x26;token=21db8bac-7bb9-4d3c-a644-93aad53bcc76" alt=""><figcaption></figcaption></figure>

**PANEL COLOR**

The <mark style="color:orange;">**Panel Color**</mark> allows you to change the color of the top four widget panels.

<figure><img src="https://278174896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FpH7f7qBXjb57cdLvfyxr%2Fuploads%2FbWAYRrS227RMRg3f8n9B%2Fpanel_colors.jpg?alt=media&#x26;token=2e560da1-bfa3-43f7-8cc9-1a6009660a88" alt=""><figcaption></figcaption></figure>

**BACKGROUND COLOR**

The <mark style="color:orange;">**Background Color**</mark> allows you to change the color of the background of the widget if you're not using a custom background.

<figure><img src="https://278174896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FpH7f7qBXjb57cdLvfyxr%2Fuploads%2FeIp4bz2iblXeWWMhg4UQ%2Fbackground_colors.jpg?alt=media&#x26;token=bfe45f87-78a9-4335-b1f2-39d42c1071f1" alt=""><figcaption></figcaption></figure>

**BUTTON COLOR**<br>

The <mark style="color:orange;">**Button Color**</mark> allows you to change the color of the button that is directly below the top four panels.

<figure><img src="https://278174896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FpH7f7qBXjb57cdLvfyxr%2Fuploads%2FGaLdvDmaxQdJAywinjQR%2Fbutton_colors.jpg?alt=media&#x26;token=40bfa1a2-198d-4882-8325-e662464eb8c9" alt=""><figcaption></figcaption></figure>