Building a Custom Theme in Deckle

Pick a colour for your sidebar, a colour for the page you write on, and an accent, and Deckle builds a complete, coordinated theme around them, right alongside Deckle's other Settings. Every remaining colour is derived for you, and any one of them can be overridden by hand if you want it a specific way.

What You Can Do

• Colour the window chrome and the writing page independently: dark sidebars with a white page, a green sidebar with a cream page, or anything else.
• Choose an accent freely. Its hue and its brightness are yours; a pale pink accent works on a dark theme.
• Override any individual colour in the interface, from the index cards to the scrollbars.
• Preview it live, see a legibility readout as you go, then edit or delete it later.
• Export a theme as a .deckletheme file and share it, or import one someone sent you.
• Save as many custom themes as you want, alongside the built-in ones.

How to Build a Custom Theme

1. In Settings → Appearance, click Build a theme.
2. Pick a starting point from six presets covering two-tone, all-light, and all-dark shapes.
3. Adjust the three controls:
   • Sidebar & window: a colour, plus a light or dark setting for everything derived from it.
   • Writing page: the same, for the manuscript surface.
   • Accent: buttons, focus rings, and active rows.
4. Give it a name and save. It appears alongside your built-in theme options from then on.
5. Edit, export, or delete it any time from the same Appearance screen.

Two-Tone Themes

The sidebar and the page are separate regions, so a dark theme no longer has to darken your manuscript along with the furniture. Dark chrome around a light page is the arrangement most professional design tools default to, and three built-in themes ship in that shape: Studio (graphite and white), Atelier (forest and cream), and Slate (charcoal-blue and warm off-white).

Individual Colours

Open Individual colours in the theme builder for a per-surface list: app background, sidebar, toolbar, popovers, interface text, page background, body text, headings, cursor, selection, accent, borders, scrollbars, index cards, and the success/warning/info colours.

Anything you leave alone stays derived, and keeps following the three main colours as you change them. Anything you set stays put, along with the hover and active states that hang off it, so a hand-picked sidebar doesn't leave its hover colour stranded on the old one. Each overridden colour gets a reset button to hand it back to the generator.

Legibility

Deckle won't stop you choosing a colour, but it will tell you what it costs. As you build, a readout under the preview scores the pairings that matter (body text on the page, interface text on the sidebar, the accent against the toolbar) against WCAG contrast targets.

Every text colour is automatically floored at WCAG AA (4.5:1) against whatever it sits on, adjusting only when your choice would fall below it. Body text aims higher, at AAA (7:1), which is the right target for something read for hours at a time. AAA isn't always physically reachable: no colour whatsoever clears 7:1 against a mid-grey surface, so if you pick one, the readout says so rather than quietly overriding the surface you chose.

Sharing Themes

Export writes a .deckletheme file: plain, readable JSON containing just your colours. Send it to anyone, and they can Import it from the same Appearance screen. Imported themes arrive as new themes rather than replacing anything you already have, and get a numbered name if the name is already taken.

A Couple of Things Worth Knowing

💡 Warning colours stay red and success colours stay green, whatever your accent is, so a status signal never blends into your scheme or turns an unexpected colour.

💡 Light and dark are per-region, not per-theme. The app's overall mode (what the operating system's title bar and scrollbars match) follows the window, not the page.