> For the complete documentation index, see [llms.txt](https://docs.cwicly.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.cwicly.com/global-styles/global-styles/global-colours/palette-tab.md).

# Palette tab

The Palette tab allows you to generate and customise an 11 point palette.

Click “on” to activate a global colour palette. Click “off” to deactivate the palette.

For a better understanding of the palette or dynamic colour variations values, hover over a specific colour and the relative information will be displayed.

Hover over your palette or dynamic colour variation to find the connected base colour.

## Activate

The Palette tab can be accessed by selecting a global colour.

* In the Block Inspector, open the Global Styles tab.
* Open the Colours tab.
* Select a global colour.
* Open the Palette tab.
* Click the "on" button to activate.
* The generated Palette will now be visible in the Folder above the Global Colour chips.

The generated colour palette provides a range of tints, shades and tones based on the global colour.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2Fij1mrEXdi1K6L1RnPhvB%2Factivate%20palette.jpg?alt=media&amp;token=66c07346-49fb-4d63-8686-137bdc1fe08a" alt=""><figcaption></figcaption></figure>

## Additional Information

If you hover over an 11 point palette, additional relative information about the colour will be displayed.

* In the Block Inspector, find Global Colours in the Colours tab of the Global Styles tab.
* Find the 11 point palette you wish more information about.
* Hover over a specific colour.
* Additional information relative to the specified colour will be displayed.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FdZEuoPGKrDEfZIa8nnQJ%2Faddi%20information.jpg?alt=media&amp;token=8bc3ce1d-d491-4a28-8133-d9a57ab9c0b3" alt=""><figcaption></figcaption></figure>

## Modify

You can modify the base colour and generate a new palette to suit your requirements.

* Open the Palette tab.
* Click the "on" button to activate.
* Click the palette in the Colour modal or the Block Inspector.
* Select a new base colour.

This will generate a new palette.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FiwlMKfCijRy8b5c1AHwt%2Fmodify%20.jpg?alt=media&amp;token=6c4fd956-1ebf-47ff-9a0b-f61543d407c2" alt=""><figcaption></figcaption></figure>

## Customise

You can customise a specific colour in the 11-stop generated palette.

* Open the Colours tab in the Global Styles tab.
* In the Block Inspector, find the 11-stop palette you wish to customise.
* Click a specific colour to open the Global Colour modal.
* Modify accordingly.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FiE0fKS3vJJXDCWAwgeRZ%2Fcustomize.jpg?alt=media&amp;token=af70c43c-8919-43a6-84ba-669815b5d0cc" alt=""><figcaption></figcaption></figure>

## Dot Indicator

Using smart algorithms, the colour palette is always balanced, never too light or too dark.&#x20;

With the help of the dot indicator, you can follow the placement of your base colour.

* Open the Palette tab.
* Click the "on" button to activate.
* Click the palette in the Colour modal or the Block Inspector.
* Select a new base colour.
* Hover over the new palette to observe where the new base colour is placed within the palette.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2F4e6EsnSzl1PGOJAGGeiK%2Fdot%20indicator.jpg?alt=media&amp;token=736dcac1-c34c-44b0-ab37-c23bf23c4b32" alt=""><figcaption></figcaption></figure>

## Maximum Brightness

The maximum brightness field determines the lightest permitted colour.

* Open the Palette tab.
* Click the "on" button to activate.
* Input required Maximum Brightness value.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2Fh8l63e4lvPefVobg9uev%2Fmax%20brightness.jpg?alt=media&amp;token=c33ea01a-0829-4545-84ef-440eb9b216bc" alt=""><figcaption></figcaption></figure>

## Minimum Brightness

The minimum brightness field determines the darkest permitted colour.

* Open the Palette tab.
* Click the "on" button to activate.
* Input required Minimum Brightness value.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FGdu7okeKGKvpEIxzsp3d%2Fmin%20brightness.jpg?alt=media&amp;token=0b4d8c2e-ab87-4d5a-9b01-cb6a4306293e" alt=""><figcaption></figcaption></figure>

## Hue

The hue field determines the hue variations the generator is permitted to use.

* Open the Palette tab.
* Click the "on" button to activate.
* Input required Hue value.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2F46fPf1qlza9iOZxL2CuU%2Fhue.jpg?alt=media&amp;token=3da4b113-9730-4957-8f25-6c7b6940108e" alt=""><figcaption></figcaption></figure>

## Saturation

The saturation field determines how vivid or muted the generated palette can be.

* Open the Palette tab.
* Click the "on" button to activate.
* Input required Saturation value.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FHxObowWGnulGyUbqhv8t%2Fsaturation.jpg?alt=media&amp;token=10ff7517-fb3e-47ce-8b48-0409b61286fa" alt=""><figcaption></figcaption></figure>

## Type (Normal/Vivid)

The normal and vivid options determine the distribution of generated colours.

* Open the Palette tab.
* Click the "on" button to activate.
* Find the Type option.
* Toggle Normal or Vivid as required.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2Fpzcm6pXO5Vcgsjr80KPz%2Fnormal_vivid.jpg?alt=media&amp;token=25c72a1d-d652-4b90-ad44-ab495148a261" alt=""><figcaption></figcaption></figure>

## Dark Mode (Normal/Reversed)

The Normal and Reversed options determine how colours are ordered in Dark Mode.

* Open the Palette tab.
* Click the "on" button to activate.
* Find the Dark Mode option.
* Toggle Normal or Reversed as required.

<figure><img src="https://3250709389-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MS33S0eoYwMaMrLb7T_%2Fuploads%2FBXRKTELLlZ9RS8Hd2yAc%2Fnormal_reversed.jpg?alt=media&amp;token=ec3e4800-c880-43ff-b85e-7642b2b4114e" alt=""><figcaption></figcaption></figure>
