> For the complete documentation index, see [llms.txt](https://docs.globo.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.globo.io/swatch/settings/general.md).

# General

Tooltips and custom CSS — the settings that apply everywhere.

**Settings → General** holds the two storewide options. A live **Preview** on the right shows the effect, with an **Image** / **Color** toggle to preview either kind of swatch.

<figure><img src="https://3138853960-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FDsbeTbRNMPUo58YEXkMj%2Fuploads%2Fgit-blob-749ee1725ac349a87b9961b21c0bfaf8c2fbc282%2Fsettings-general.png?alt=media" alt="Settings, General tab, showing the Tooltip section, Enable Custom CSS, and the live Preview panel"><figcaption><p>The Preview panel on the right shows the effect of every setting as you change it.</p></figcaption></figure>

## Show Tooltip on Hover

Displays the option name — "Red", "Large" — when a shopper hovers over a swatch. It's one switch for the whole store: product pages and collection pages follow the same setting.

Only some styles show the tooltip:

* **Shown on:** **Color or custom image swatch**, **Variant image swatch**, **Button**, **Button without border** and **Pill button**.
* **Not shown on:** **Pill swatch**, the three price styles (**Variant image swatch with price**, **Color or custom swatch with price**, **Button with price**) and the three dropdowns (**Dropdown**, **Color or custom swatch dropdown**, **Variant image dropdown**).

It's most useful on colour and image swatches, where the chip alone doesn't say what the value is called. On the button styles it repeats the label that's already on the button.

{% hint style="info" %}
On collection pages, tooltips are hidden while swatches are in carousel mode — see **Carousel** in [Customize a swatch style](/swatch/appearance/customize-a-swatch-style.md). Product groups have their own switch, **Show Tooltip for Product Group**, in [Product groups settings](/swatch/settings/product-groups.md).
{% endhint %}

## Enable Custom CSS

Turn this on to reveal a CSS editor for changes the **Appearance** settings can't make — see [Custom CSS](/swatch/settings/custom-css.md).

## Save

Click **Save** at the top of the page. A **Settings saved** message confirms it.

## Related pages

* [Swatch on product page](/swatch/settings/swatch-on-product-page.md)
* [Swatch on collection page](/swatch/settings/swatch-on-collection-page.md)
* [Custom CSS](/swatch/settings/custom-css.md)