# Global Styles

<figure><img src="https://lh3.googleusercontent.com/2-ZFMG06gxA78DOGySwMfxVvIe9pvXayhlAdr0atenVNcWHbRvf97_7aoVJZd0M_0q-uL4FyTQU0emFIDjXUy6b4l1w0RG1iYscwPammK3DcKLbWTvKk3jDarzzxiPXyY6iOgflOGWUI6OM-TrfM2FdD_5XaXyAnfkbW1EYbJhzT-BN2OGhaTuZSzb58yQ" alt=""><figcaption></figcaption></figure>

Global Styles are CSS styles that are applied to elements throughout the entire website, rather than being applied only to specific elements on individual pages.

These styles can include things like default font, font size, and font colour, default background colour or image, elements such as buttons or links and the default alignment of text and other elements.

Global Styles help to ensure that the website has a consistent look and feel, and it can also make it easier to make changes to the design of the website, because the changes will be applied automatically to all the pages on the site.

The Global Styles option adds an interface to apply styling when in the Gutenberg editor.

{% hint style="info" %}
Global Styles are automatically saved when you save or publish a post or page.
{% endhint %}

{% hint style="info" %}
If you wish to only save the Global Styles, click on Save Settings in the Global Styles tab.
{% endhint %}

<details>

<summary>Modify</summary>

1. Navigate and click the Cwicly Global Styles menu tab
2. Modify the desired property.

</details>

{% embed url="<https://www.youtube.com/watch?v=UNIYJDRhwfc>" %}
How To - Global Styles
{% endembed %}

## Style Variations

{% hint style="info" %}
There are 3 Style Variations (Style 1, Style 2, Style 3).
{% endhint %}

&#x20;Style Variations allow you to switch between user defined Global Style Properties in an instant. This gives you the flexibility to choose the best combination of colour and typography for your site.

{% embed url="<https://www.youtube.com/shorts/sFeIbiq-HR8>" %}

<details>

<summary>Select</summary>

1. Navigate to the Global Styles panel
2. Select the desired style&#x20;

</details>

## Global Colours

The Global Colours group allows you to add global colors to your website. So you can create a unified color palette across your entire website, but also perform adjustments across the board.

<figure><img src="https://lh5.googleusercontent.com/NbApGPEj1Hji21fcpdwMPOrfD2WReUrkx8_jxvShpau-uS60Y5nHuU0yC16mGpoEz7mwYGD9JqFwvEdLXRy8pAiLZE9uXoBbZAmuvOcduyPVA6W64BA3qKCWjxcnYf2uqDTK9hOuZyNv1cRH5-Z6tv_5G0GJ6xAocBy4Qw1KyUZiWhe24QHRhiyq7xfgXw" alt=""><figcaption></figcaption></figure>

{% content-ref url="global-styles/global-colours" %}
[global-colours](https://docs.cwicly.com/global-styles/global-styles/global-colours)
{% endcontent-ref %}

## Global Typography

The Global Typography group allows you to apply Global Typographic Styles across your website for common elements (body text, links, headings etc.).

<figure><img src="https://lh5.googleusercontent.com/UsS_lPn9u8jy_JR2uoASiSHKefMj3_WixxW0EMk35Jv9Ypu6HdAltWlUDr5ThkDgU8VRJt2taBjjyz00Tf6iEzNLghVgJRhyhmqsgqE9Nw66wdhjqkOjwhw-JhU6YoJOYul7J5DWxb-CGTCCRsTkMH1-uFFC-etMFdwbPnQnge8-Vn196ZlnjY00X1zjeA" alt=""><figcaption></figcaption></figure>

{% content-ref url="global-styles/global-typography" %}
[global-typography](https://docs.cwicly.com/global-styles/global-styles/global-typography)
{% endcontent-ref %}

## Global Block Typography

The Global Block Typography panel allows you to add global block typography that can be added on a per block basis, but also perform adjustments across the board.

{% content-ref url="global-styles/global-block-typography" %}
[global-block-typography](https://docs.cwicly.com/global-styles/global-styles/global-block-typography)
{% endcontent-ref %}

## Theme Elements

Allows you to apply styling to website elements on a global level.

{% content-ref url="global-styles/theme-elements" %}
[theme-elements](https://docs.cwicly.com/global-styles/global-styles/theme-elements)
{% endcontent-ref %}

## Settings

Allows you to customise various Cwicly settings.

{% content-ref url="global-styles/global-settings" %}
[global-settings](https://docs.cwicly.com/global-styles/global-styles/global-settings)
{% endcontent-ref %}


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.cwicly.com/global-styles/global-styles.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.