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

# Dashboard Appearance

> Personalise your dashboard with colour mode, brand palettes, reading fonts, density, and motion preferences

## Introduction

Every team member can personalise how the Bella Booking dashboard looks and feels. Appearance preferences are saved to your profile and sync across all your devices — so your preferred setup follows you whether you're on your desktop, tablet, or phone.

**Note:** These settings affect **your dashboard only**. They do not change how your online booking page appears to clients. To customise your booking page appearance, see [Online Booking Settings](/settings/online-booking).

***

## Accessing Appearance Preferences

You can open the appearance popover in two ways:

| Method                | How                                                                         |
| --------------------- | --------------------------------------------------------------------------- |
| **Appearance button** | Click the paintbrush icon in the top-right header bar                       |
| **Command palette**   | Press **Cmd+K** (Mac) or **Ctrl+K** (Windows/Linux), then type "appearance" |

***

## Colour Mode

Choose how the dashboard handles light and dark themes:

| Option     | Behaviour                                                        |
| ---------- | ---------------------------------------------------------------- |
| **Light**  | Always uses light theme                                          |
| **Dark**   | Always uses dark theme                                           |
| **System** | Follows your operating system's appearance setting automatically |

***

## Brand Palette

Set the accent colour used across the dashboard — buttons, links, focus rings, charts, and highlights all update to match your chosen palette.

Choose from **10 curated palettes**:

| Palette        | Style              |
| -------------- | ------------------ |
| **Bella**      | Indigo (default)   |
| **Bloom**      | Muted rose         |
| **Atelier**    | Magenta-violet     |
| **Velvet**     | Burgundy and gold  |
| **Sage**       | Earth green        |
| **Botanical**  | Emerald            |
| **Dune**       | Tan, minimalist    |
| **Onyx**       | Charcoal and amber |
| **Coastal**    | Teal               |
| **Terracotta** | Clay, earthy       |

### Custom colour

Select **Custom** to pick any hex colour as your primary accent. The dashboard derives a complementary accent automatically.

<Tip>
  The brand palette you choose here only affects your personal dashboard view. It does not change the palette on your online booking page — that is configured separately in [Online Booking Settings](/settings/online-booking).
</Tip>

***

## Reading Font

Choose a typeface that suits your reading preference or accessibility needs:

| Font                      | Description                                             |
| ------------------------- | ------------------------------------------------------- |
| **Default** (DM Sans)     | The standard dashboard typeface                         |
| **Lexend**                | Designed for easier on-screen reading                   |
| **OpenDyslexic**          | Weighted letterforms to help with dyslexia              |
| **Atkinson Hyperlegible** | Maximised letter differentiation for low-vision support |

***

## Text Size

Choose how large the dashboard text appears. A bigger size makes everything easier to read while keeping the layout intact — so you get larger text without zooming, which is gentler on small screens than browser zoom:

| Option      | Description                                        |
| ----------- | -------------------------------------------------- |
| **Default** | The standard dashboard text size                   |
| **Large**   | Bigger text across the dashboard, layout unchanged |
| **Larger**  | The biggest text, layout unchanged                 |

<Tip>
  Whether you bump the text size up here or zoom your browser in, dialogs scroll within themselves on small or zoomed screens — so their buttons always stay reachable rather than being pushed off-screen.
</Tip>

***

## Density

Control the spacing and whitespace of the dashboard layout:

| Option          | Description                                            |
| --------------- | ------------------------------------------------------ |
| **Default**     | Standard spacing                                       |
| **Comfortable** | Looser line and letter spacing for a more relaxed feel |

***

## Motion

Control how animations and transitions behave:

| Option      | Description                                                              |
| ----------- | ------------------------------------------------------------------------ |
| **Auto**    | Follows your operating system's reduced-motion setting                   |
| **Reduced** | Always uses near-instant transitions regardless of OS setting            |
| **Focus**   | Reduced motion plus hidden non-critical UI chrome for fewer distractions |

<Tip>
  If you've already set "Reduce motion" in your operating system preferences, the **Auto** setting respects that automatically — no extra configuration needed.
</Tip>

***

## How Preferences are Saved

Your appearance preferences are applied instantly via your browser and saved to your team member profile on the server. This means:

* **Instant:** changes take effect immediately with no page reload
* **Cross-device:** your preferences sync across every device you sign into
* **Per-team-member:** each team member has their own independent preferences
* **Offline-safe:** if the server is unreachable, your last-used preferences are kept in the browser

***

## FAQs

**Q: Do my appearance preferences affect what clients see on the booking page?**
A: No. Dashboard appearance is personal to each team member. Your online booking page has its own appearance settings configured in [Online Booking Settings](/settings/online-booking).

**Q: Can I set a default appearance for all team members?**
A: Not currently. Each team member chooses their own preferences. New team members start with the Bella palette, light mode, and default settings.

**Q: I changed my palette but the booking page still looks the same — why?**
A: The dashboard palette and the online booking palette are independent. To change your booking page colours, go to **Settings > Online Booking** and update the brand palette there.

**Q: What does the Focus motion option do differently from Reduced?**
A: Focus includes everything in Reduced (near-instant transitions) and additionally hides non-critical UI chrome to minimise visual distractions.

**Q: Will my preferences carry over if I sign in on a new device?**
A: Yes. Preferences are saved to your profile and sync automatically when you sign in.