# themes

beep supports per-user themes, because we like customizability. by default, no
theme is selected and beep is 100% plain html.

themes can be applied to beep by going to your profile and scrolling to your
settings, then changing the theme url.

here is a list of themes that work with beep and themes for beep!

## drop-in

> note that these themes were **not** made specifically for beep, they just work
> well out-of-the-box with it!

> there are also *tons* of drop-in css themes out in the wild, so the list here
> is not even close to comprehensive. these are just my personal picks that i
> found to be comfy with beep!

| name       | source                                   | css theme url                                                           |
|------------|------------------------------------------|-------------------------------------------------------------------------|
| sakura     | <https://github.com/oxalorg/sakura>      | https://cdn.jsdelivr.net/npm/sakura.css/css/sakura.css                  |
| water.css  | <https://github.com/kognise/water.css>   | https://cdn.jsdelivr.net/npm/water.css@2/out/water.min.css              |
| kacit      | <https://github.com/Kimeiga/kacit>       | https://cdn.rawgit.com/Kimeiga/kacit/b3f813ed/kacit.min.css             |
| pico       | <https://github.com/picocss/pico>        | https://cdn.jsdelivr.net/npm/@picocss/pico@2/css/pico.classless.min.css |
| simple.css | <https://github.com/kevquirk/simple.css> | https://unpkg.com/simpledotcss/simple.min.css                           |

> here is a big list of drop-in themes:
> <https://github.com/dohliam/dropin-minimal-css>

## beep-specific

| name    | source                                             | css theme url              |
|---------|----------------------------------------------------|----------------------------|
| default | <https://tangled.org/emmeline.girlkisser.top/beep> | /static/themes/default.css |

## built-in

| name                        | based on (if applicable)        | css theme url                   |
|-----------------------------|---------------------------------|---------------------------------|
| default                     | n/a                             | default.css                     |
| catppuccin-macchiato-pink   | water.css + catpuccin macchiato | catppuccin-macchiato-pink.css   |
| catppuccin-macchiato-green  | water.css + catpuccin macchiato | catppuccin-macchiato-green.css  |
| catppuccin-macchiato-yellow | water.css + catpuccin macchiato | catppuccin-macchiato-yellow.css |
| hackerman                   | simple.css                      | hackerman.css                   |

> beep also features some built-in themes, some of which are based on the themes
> present in the "it just works" list!

> make sure to prefix the url with `/static/themes/`