> For the complete documentation index, see [llms.txt](https://docs.ngsurvey.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.ngsurvey.com/form-management/style-branding/style-editor.md).

# Style Editor

The style editor is the heart of the style editing process and is composed of 4 main sections to help you design your style.

![](https://1025048312-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBbnvXKWEIQ8rxZvIJO%2F-MBbs5e73j5a3NTi4mgQ%2Fimage.png?alt=media\&token=c342fd25-11fa-496a-83f1-1ce835417e31)

* [Style](/form-management/style-branding/style-editor/style.md) let you set the general properties of the style like its name, colors or header image.
* [Theme](/form-management/style-branding/style-editor/theme.md) let you define the general theme with its colors, fonts and overall look that will be applied globally across all the form elements.
* [Elements](/form-management/style-branding/style-editor/elements.md) let you customize individually in a user friendly way the design of your form elements.
* [CSS](/form-management/style-branding/style-editor/css.md) gives you complete control over the design and layout of the style as you can use plain CSS code to define all the details of your style. 

{% hint style="info" %}
All changes that you make during the editing process are applied live to the survey on the right allowing you to see right away if your style looks good or bad.
{% endhint %}

## 💻 Target devices

As respondents can take your survey various devices you may need to [adapt the design](/form-management/style-branding/style-editor/mobile-responsive-design.md) to match a specific device. Using the target device you can preview and edit your style for a [specific device](/form-management/style-branding/style-editor/mobile-responsive-design.md).  

![](https://1025048312-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBcQl5nAwvGjWz5r-3F%2F-MBcSrl_hobmv0OYkAWn%2Fimage.png?alt=media\&token=c49e6ef8-500d-4b80-a7ab-83d50c6261d6)

## 💢 Previewing errors

Enabling the preview errors property will display all the error messages that would normally show up in your survey. This will allow you to define and preview the style of the error messages while editing your style. 

![](https://1025048312-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBc-WeV_4p5ioAkKy1Z%2F-MBcCJcvVOf5dBbNxmSx%2Fimage.png?alt=media\&token=cfb81429-76f0-4c91-9bbb-1d21dfea265a)

![](https://1025048312-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M8fLhS0bmfBRyq0HdUm%2F-MBc-WeV_4p5ioAkKy1Z%2F-MBcC_b0tT935KaGzFIU%2Fimage.png?alt=media\&token=c69179dc-473d-43a5-a1f3-d17c4e4de41d)


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

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

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.ngsurvey.com/form-management/style-branding/style-editor.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

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.