# Work in Progress: How to Use Custom Selectors

{% hint style="info" %}
You will find most of what you need as an option to select in the Design Tab. But for some very specific cases, you'll need to find the class of the component you want to style and add it as a Custom Selector.
{% endhint %}

### Step 1: Enable Custom Selectors

* Select the Entire Flow by going to the Layers Tab on the left Sidebar, then to the "All" Tab, and finally clicking on "Entire Flow"
* On the Options Tab on the Right Sidebar, check the "Enable Custom Selectors" box

### Step 2: Add the Selector

* Turn on the "Show Custom Selectors" Toggle. You'll find it in the Design Tab of the Right Sidebar. For it to show, you need to select for example "whole thing" of a component (anything selected will do, but it won't show if no component is selected)
* Type or paste the selector in the input field and press Enter. 

{% hint style="info" %}
If the selector is the class of an HTML tag (for example `big-button`), remember to add a dot in front of it (`.big-button`). If it's just a specific tag (like `ul` or `li`) you don't need the dot, but it will apply to the whole flow.
{% endhint %}

### Step 3: Add the Styles

* After creating the custom selector, try setting some very obvious styles, to confirm that's the selector you need. 
* If you delete all styles on that selector, it will disappear and you'll have to create it again.


---

# 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.trysavvy.com/other-useful-docs/work-in-progress/pending/work-in-progress-how-to-use-custom-selectors.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.