Appearance Settings (/settings/appearance) lets you personalize how Winnerr looks. Choose your theme, adjust the layout density, pick fonts, and configure accessibility options.
Theme
Pick a color theme to match your brand or personal preference:
| Option | Description |
|---|
| Light | Clean white background, dark text |
| Dark | High-contrast dark background, ideal for low-light work |
| System | Automatically follows your OS preference |
| Custom | Choose a primary color from the palette |
Custom colors
Choose a custom accent color that will be used for buttons, links, highlights, and active states throughout the interface. This doesn’t change your client-facing portal (configured separately under your portal settings).
Layout
(/settings/appearance/layout)
Control how the main app layout feels:
| Setting | Options |
|---|
| Sidebar style | Expanded (default) · Collapsed icons |
| Density | Comfortable · Compact |
| Content width | Full-width · Centered max-width |
| Card view default | List · Grid |
Typography
(/settings/appearance/typography)
| Setting | Options |
|---|
| Font family | System (default) · Inter · DM Sans · Geist |
| Font size | 14px · 15px (default) · 16px |
| Line height | Compact · Normal · Relaxed |
Accessibility
(/settings/appearance/accessibility)
| Setting | Description |
|---|
| Reduce motion | Disables decorative animations throughout the app |
| High contrast mode | Increases contrast ratios on text and UI elements |
| Focus indicators | Enhances visible focus rings for keyboard navigation |
| Cursor size | Normal · Large |
If you find the interface too animated, enabling Reduce motion is the fastest way to make Winnerr feel calmer without changing anything else.
