# Apply Custom CSS

<figure><img src="/files/irFLRCMAlI6iTmoVwJnO" alt=""><figcaption></figcaption></figure>

<mark style="color:green;">**Step: 1**</mark> Go to **General Settings --> CSS**

<mark style="color:green;">**Step: 2**</mark> Give the Element identifier on which you want to apply the CSS. Check [this table](https://help.twinr.dev/screen-customization/hide-elements#example-of-elements) for how to find element identifier.

<mark style="color:green;">**Step: 3**</mark> Give CSS property that will be applied on the element.

<mark style="color:green;">**Step: 4**</mark> Select the screens on which you want to apply this CSS to.

For example, you want to change the Price tag color to Red in the mobile app to differentiate from the website. Below is how the App will look different than the website. Note that the color change will be applied to all the screens that you have selected.

Left is The Website opened in the browser and Right side is the Native Twinr app.

![Website in the browser](/files/kmM971uqMSo3DM3qE2kF)     ![Native Twinr App](/files/a7jqUPOyXDxHTKRdmwW3)

Watch video below to see how to customize your web page by applying CSS.

{% file src="/files/jZkAGgbA9KDH4zM6SdjO" %}


---

# 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://help.twinr.dev/screen-customization/apply-custom-css.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.
