# Creating and editing styles
## **What are Styles?**
**Styles** are a set of layout elements: fonts, headings, text and background colors, indents, dividers, icons, and buttons.
You can create unique styles for different types of content.
## Creating a Style
There are three ways you can create a style:
* [**Quick setup**](#h_33ad421b-6501-439d-953e-fd1764bd8f85)**:** Once you set your [Setka Editor account](https://editor.setka.io/login), we offer you to create your first simple style. If there are any styles created already, you can start a quick setup by choosing to **Create custom style** **>** **Quick setup** in **Styles** option from your Setka Account.
* [**Advanced setup**](#h_aab87907-48fb-4b69-ac8f-7123d0e61530)**:** Choose all fonts, colors, and other layout tools yourself with the help of an advanced setup. To create a style in this mode, open **Styles** in your [Setka Account](https://editor.setka.io/login) and choose to **Create custom style** **>** **Advanced setup**.
* From a copy of an already created style. To do that, open the **Styles** section in your [Setka Account](https://editor.setka.io/login) and hover your mouse over the needed style badge. You will see a **Style actions** menu in the upper right-hand corner, click on it and choose **Duplicate.**
### Quick setup
In a quick setup mode, you can only choose a color palette and a font combination. The result will be seen in an example right under the menu:
Any color can be replaced with the one that is used in your branding:
Save your style and choose it when creating your first post.
You can edit a style created in a quick set-up mode by adding any other elements, e.g., fonts, icons, button layout, etc. To do that, you need to opt for an [advanced setup](#h_aab87907-48fb-4b69-ac8f-7123d0e61530).
### Advanced setup
To set your style manually, you need to open the Styles section in your [Setka Account](https://editor.setka.io/login). Then choose to **Create custom style** **>** **Advanced setup**:
All styles are being edited in an **Advanced setup** mode.
You can read more about style elements in the following articles:
{% content-ref url="text-formats-and-fonts" %}
[text-formats-and-fonts](https://setka.gitbook.io/help-center/content-design-system-manager/text-formats-and-fonts)
{% endcontent-ref %}
{% content-ref url="text-and-background-colors" %}
[text-and-background-colors](https://setka.gitbook.io/help-center/content-design-system-manager/text-and-background-colors)
{% endcontent-ref %}
{% content-ref url="dividers" %}
[dividers](https://setka.gitbook.io/help-center/content-design-system-manager/dividers)
{% endcontent-ref %}
{% content-ref url="../setka-post-editor/icons" %}
[icons](https://setka.gitbook.io/help-center/setka-post-editor/icons)
{% endcontent-ref %}
{% content-ref url="../setka-post-editor/buttons" %}
[buttons](https://setka.gitbook.io/help-center/setka-post-editor/buttons)
{% endcontent-ref %}
{% content-ref url="components" %}
[components](https://setka.gitbook.io/help-center/content-design-system-manager/components)
{% endcontent-ref %}
Click **Save** at the bottom of the page to save your changes. Do not forget to publish your style to have it available in the editor.
{% hint style="info" %}
**Important:** the changes you make will be applied to **all** posts created with this style.
{% endhint %}
### Preview
The preview panel on the right reflects the changes you make. Here you see and change the way your style elements (text formats, colors, etc.) collocate with each other:
Use buttons **Desktop** / **Tablet** / **Mobile** in the upper part of the screen to change a device type:
If you want to check the way your font goes with some definite phrases or how the font lays on the definite symbols, change the preview text with the help of the **Edit** button in the upper right-hand corner:
Choose your text and click **Save** to apply the changes:
Click **Restore default** to return to the default text:
### How can Style changes impact the already published posts?
All changes you make and save are being applied to all posts created with this style.
#### Adding elements
Existing posts will not be changed in case you add new style elements like colors, dividers, text formats, or buttons. You can save the changes in the same post style.
#### Removing elements
Existing posts will be affected if you **remove** style elements (icons, dividers, buttons, etc.), update text formats, or apply any other changes to style elements used in posts that are already published.
To avoid affecting already published posts, copy your style by clicking **Save** -> **Duplicate style.**
#### Here are some examples of changes in a style that can affect already published posts:
* **Significant changes to the font size**. As a result, some words might not fit in the columns.
* **Deleting icons.** For example, if you delete numerical icons, your post's structure might be lost.
* **Deleting dividers.** For example, if you delete dividers for quotations, it will be unclear that this text is direct speech.
#### Changes in Design Cloud posts
Style changes will not be applied to already exported and published posts created in Design Cloud. To make your changes applied to an already published post, you need to export it again from the **Posts** section in your [Setka Account](https://editor.setka.io/login) after saving your style.
## Publishing your Style
A new style will be saved as a **Draft.** You can edit style drafts in your Setka Account. To use a new style, you need to publish it by clicking **Publish**. Preinstalled styles are marked with an icon 
.
## Working with Styles
### Styles renaming
To rename your style, open it in the **Styles** section in your [Setka Account](https://editor.setka.io/login) and choose the **Style** **name** option in the left menu. Apply changes by clicking on **Save**.
### Activating/deactivating styles
To deactivate your style, do the following: open **Styles -> ... (Style actions)** and click **Disable.**
Deactivated styles will not be available for new posts, but you will be able to change them in posts already created on them.
To activate a style, open the **Styles** section and click on **Make active** in a style's badge.
### Deleting a style
To delete a style, open **Styles -> ... (Style actions)** and click **Delete this style.**
{% hint style="info" %}
**Important:** Before deleting a style, make sure that there are no posts created with it as such posts will completely lose the overall layout.
{% endhint %}
Confirm your action by clicking on the checkbox next to **I don’t have posts that will be affected by this action.** Finish deleting by clicking on **Delete Post Style.**
### Setting a default Style
To set a default style for new posts open **Styles -> ... (Style actions)** -> **Set as default**. There is only one style that can be chosen as a default one.
### Copying a Style
To copy an already created style, open the **Styles** section in your Setka Account and mouse over the style's badge. In a **Styles action** menu (in the upper right-hand corner), choose **Duplicate**.
## Components
Components are saved inside each style as well as there is a set of components for each style. You can learn more about the components in these articles:
{% content-ref url="components" %}
[components](https://setka.gitbook.io/help-center/content-design-system-manager/components)
{% endcontent-ref %}
{% content-ref url="broken-reference" %}
[Broken link](https://setka.gitbook.io/help-center/content-design-system-manager/broken-reference)
{% endcontent-ref %}
## Templates
As well as components, templates belong to a definite style and are being edited via Content Design System Manager (CDSM). You can learn more about templates from our article Post Templates.
## Custom CSS
In case you want to apply additional properties to style elements that are not available in the Content Design System Manager (CDSM), you can opt for Custom CSS-codes.
To do this, click the **Custom CSS** link in the bottom left panel of the CDSM. In the pop-up window, you can enter the CSS-code.
You can read more about Custom CSS hacks in our article [Custom CSS - advanced features for your layout design.](https://setka.gitbook.io/help-center/setka-post-editor/custom-css#h_a34efa14-685a-4473-88d2-d726df37610c)
## Styles for Setka Editor free plan
You can create as many styles as you need on a Free plan. However, only 2 of them will be available: one of our preinstalled styles and one of your custom ones. To use a new custom style, disable the one that is currently active:
There are three conditions under which your plan can be downgraded to Free:
* 14-day Demo plan expiration
* 14-day Trial plan expiration
* Non-renewal of your subscription plan.
To continue using several custom styles at once, renew your paid subscription. You will be able to activate your inactive styles after renewal.