# Dialogs

Dialogs are overlay windows used throughout your storefront, for example, quick-view modals, cart drawers, and other popup-style components. 

Pebble lets you customize the appearance of these dialogs so they match your store’s brand and design system.

## How to edit Dialogs

<Hint type="success">

Steps:

1. In the theme editor (**Customize**), click **Theme settings**.
2. Locate **Dialogs**.
3. Make necessary changes.
4. Click **Save**.

</Hint>

## Dialogs settings options

### Appereance

#### Inherit color scheme

![image](https://docs-assets.foxecom.app/pebble-theme/image_JqcXOa3p.png)

Determines whether dialogs use the global theme color settings or a custom scheme.

* **ON:**
  * Dialogs automatically inherit the theme’s global color scheme.
  * The **Color scheme** selector is hidden
* **OFF:**
  * Reveals the **Color scheme** dropdown
  * Let you choose a specific color scheme only for dialogs, for example, a dark modal on a light storefront.

Use this when you want the dialog to stand out, match a specific section, or improve contrast.

#### Color scheme

![image](https://docs-assets.foxecom.app/pebble-theme/image_mUsHWqkA.png)

*(visible only when “Inherit color scheme” is OFF)*

Allows you to choose a specific color scheme for all dialogs.

![image](https://docs-assets.foxecom.app/pebble-theme/image_n7xdgt2C.png)

<Hint type="info">

To edit the color schemes, go to **Theme settings** > [Colors](https://docs.foxecom.com/pebble-theme/theme-settings/colors)

</Hint>

#### Corner radius

![image](https://docs-assets.foxecom.app/pebble-theme/image_KjWQhIo9.png)

Controls how rounded the dialog’s corners appear.

* Move the slider to change from 0px (sharp corners) to 32px (fully rounded).