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

# Themes

> Customize the Voxcode interface with themes and chat backgrounds

Voxcode lets you tailor the look of the entire interface — from the overall color scheme to the texture behind your chat messages. All theme options live in the Settings panel, which you open by tapping the **gear icon** in the top-right corner of the app.

## UI themes

Voxcode ships with three themes that control the global color palette.

<Steps>
  <Step title="Open Settings">
    Tap the gear icon in the top-right navbar to open the Settings panel.
  </Step>

  <Step title="Find the Theme section">
    Scroll to the **Interface** section. The **Theme** row shows your current mode.
  </Step>

  <Step title="Cycle through themes">
    Tap the toggle button on the Theme row to cycle through the three available options.
  </Step>
</Steps>

### Available themes

<AccordionGroup>
  <Accordion title="Default (Dark)" icon="moon" defaultOpen={true}>
    The default Voxcode experience. A deep dark background with high-contrast foreground text and a cyan accent color. Best suited for low-light environments and extended coding sessions.
  </Accordion>

  <Accordion title="Light" icon="sun">
    A bright, clean interface with light backgrounds and dark text. Useful when working in well-lit spaces or if you prefer a more traditional editor aesthetic.
  </Accordion>

  <Accordion title="Monokai" icon="code">
    A warm dark theme inspired by the classic Monokai editor color scheme. Slightly warmer tones than Default Dark, with familiar syntax-highlight-style accent colors throughout the UI.
  </Accordion>
</AccordionGroup>

## Chat backgrounds

In addition to the overall theme, you can set a background texture or scene specifically for the chat area. Open Settings and look for the **Chat Background** picker inside the Interface section.

Backgrounds are grouped into three categories.

### Solid

Clean, flat backgrounds with no pattern. These adapt to your active theme.

| Option      | Description                                                                                          |
| ----------- | ---------------------------------------------------------------------------------------------------- |
| **Default** | The standard background color for your current theme — no fill override.                             |
| **Dim**     | A slightly darker fill that reduces visual noise and adds depth in dark mode.                        |
| **Warm**    | A subtle warm tint (light orange in dark mode, soft cream in light mode) that softens the interface. |

### Patterns

Geometric repeating textures drawn at low opacity over your theme background.

| Option    | Description                                                                |
| --------- | -------------------------------------------------------------------------- |
| **Dots**  | A radial dot grid pattern. Works well with both dark and light themes.     |
| **Grid**  | A fine rectangular grid. Evokes a developer tool or graph-paper aesthetic. |
| **Waves** | A diagonal crosshatch. Adds subtle depth without being distracting.        |

### Cosmos

Animated, deep-space backgrounds that replace the standard background entirely. Each Cosmos option renders a unique animated scene using rich colors and simulated starfields.

| Option            | Description                                                                  |
| ----------------- | ---------------------------------------------------------------------------- |
| **Cosmos**        | Blue and purple nebula-style animation with pulsing star particles.          |
| **Cosmos Yellow** | A warm solar scene with yellow and orange glows and a simulated starfield.   |
| **Cosmos Red**    | A red and rose nebula with deep crimson radial gradients and star particles. |

<Tip>
  The Cosmos backgrounds — especially **Cosmos** (blue/purple) — give Voxcode a premium, cinematic feel that makes voice interactions feel more immersive. If you want to make an impression during demos or live sessions, start there.
</Tip>