Themes & Appearance

Claspt ships with several built-in themes and a range of appearance options so you can make the app feel like home.

Themes

Claspt includes five built-in themes:

Theme	Style	Personality
Classic Dark	Dark	The default Claspt theme — deep dark background with high-contrast text. Clean and focused.
Nord	Dark	Inspired by the Nord palette — cool, arctic blues and muted accents. Calm and easy on the eyes.
Dracula	Dark	The popular Dracula palette — purples, pinks, and cyans on a dark base. Vibrant but not harsh.
Solarized Light	Light	Ethan Schoonover’s Solarized light palette — warm, low-contrast tones. Great for daytime use.
Solarized Dark	Dark	The dark variant of Solarized — the same carefully tuned color relationships on a dark blue-grey base. Comfortable for long sessions.

Switching Themes

There are two ways to change your theme:

Settings menu — Open Settings > General > Theme and select from the dropdown. The theme applies instantly.
Keyboard shortcut — Press Cmd+Shift+T (macOS) or Ctrl+Shift+T (Windows/Linux) to cycle through themes quickly.

Custom Accent Color

Beyond the base theme, you can customize the accent color — the highlight color used for selections, active states, buttons, and interactive elements.

Open Settings > General.
Find the Accent Color option.
Pick a color from the palette or enter a custom hex value.

The accent color overlays on top of your chosen theme, so you can have a Nord theme with an orange accent, or Classic Dark with a teal accent.

UI Scale

Adjust the overall interface size to match your display and preferences.

Keyboard Shortcuts

Action	macOS	Windows/Linux
Zoom in	`Cmd+=`	`Ctrl+=`
Zoom out	`Cmd+-`	`Ctrl+-`
Reset zoom	`Cmd+0`	`Ctrl+0`

Settings

You can also set the UI scale from Settings > General > UI Scale. This gives you precise control over the zoom level.

The sidebar width is adjustable by dragging the resize handle (the divider between the sidebar and the editor). Drag left for a narrower sidebar or right for a wider sidebar.

Your preferred width is saved automatically and persists across sessions.

Switch between two page list densities:

Mode	Best For
Comfortable	Fewer pages, want to see preview snippets beneath titles
Compact	Many pages, want to maximize visible page count

Toggle density using the density button in the sidebar header (near the sort options).

In comfortable mode, each page entry shows the title plus a brief content preview. In compact mode, only the title is shown, fitting roughly twice as many pages in the same vertical space.

Typography

Claspt uses two font families throughout the interface:

Font	Where It’s Used
Figtree	UI elements — sidebar, toolbar, settings, dialogs, page titles
JetBrains Mono	Code blocks, inline code, secret block values, and the markdown editor

Figtree is a clean, geometric sans-serif that stays legible at all sizes. JetBrains Mono is a developer-focused monospace font with ligatures and clear character distinction — ideal for reading code, secrets, and structured text.

Editor Appearance

The editor uses CodeMirror 6 with custom extensions that enhance the visual experience:

Heading line decorations — Each heading level (h1 through h6) gets a distinct font size in the editor, so the document structure is visible while you write.
Syntax highlighting — Colors adapt to your active theme, keeping markdown syntax readable.
Secret block cards — Encrypted secrets render as styled cards rather than raw markdown fences.
Line numbers — Optional, toggled from Settings > General.

Quick Reference

Here’s a summary of all appearance-related settings and where to find them:

Setting	Location	Shortcut
Theme	Settings > General > Theme	`Cmd+Shift+T`
Accent color	Settings > General > Accent Color	—
UI scale	Settings > General > UI Scale	`Cmd+=` / `Cmd+-`
Sidebar width	Drag sidebar resize handle	—
Sidebar density	Sidebar density toggle	—
Line numbers	Settings > General	—
Split view	Toolbar or shortcut	`Cmd+\`
Preview mode	Toolbar or shortcut	`Cmd+/`
Inspector panel	Toolbar or shortcut	`Cmd+I`