> For the complete documentation index, see [llms.txt](https://sbscripts.gitbook.io/sb-scripts/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sbscripts.gitbook.io/sb-scripts/sb-scoreboard/themes.md).

# Themes

Set the theme in `config.lua`:

```lua
Config.Theme = 'default' -- 'default' | 'midnight' | 'crimson' | 'emerald' | 'violet'
```

| Theme      | Look                                                                 | File                      |
| ---------- | -------------------------------------------------------------------- | ------------------------- |
| `default`  | Gearshift: orange on navy-black, Archivo type, open and close motion | `html/style.css`          |
| `midnight` | Midnight blue, the previous default                                  | `html/style-midnight.css` |
| `crimson`  | Blood red, sharper corners                                           | `html/style-crimson.css`  |
| `emerald`  | Matrix green, rounder corners                                        | `html/style-emerald.css`  |
| `violet`   | Royal purple and neon, elegant corners                               | `html/style-violet.css`   |

### Customising a theme

Open the theme's file and edit the colours at the top, under `:root`. Every element pulls its colour from those variables.

* `--bg0` to `--bg3`: background layers
* `--bdr` and `--bdr2`: borders
* `--blue` and `--blueLo`: the main accent colour, used for the search box focus ring, scrollbar hover, header glow and list icons
* `--green`, `--gold` and `--red`: ping and admin glow. These are the same in every theme on purpose.

### Adding a fifth theme

1. Copy any `style-*.css` file and edit its `:root` colours.
2. Add the file to the `files {}` list in `fxmanifest.lua`.
3. Add an entry for it in the `THEME_FILES` object near the top of `html/script.js`.