Docs Customisation Colors & Fonts
Colors & Fonts
3 min read
Customise your site's visual identity within your chosen template.
Colors
Go to Settings → Appearance → Colors.
| Setting | Description |
|---|---|
| Primary accent | Main highlight color (buttons, links, active states) |
| Background | Page background color |
| Surface | Card and panel background |
| Text primary | Main body text color |
| Text secondary | Supporting text color |
Click any color swatch to open the color picker. Changes preview live in the editor.
TIP
For best results, keep your primary accent color high-contrast against the background. Avoid very light colors on dark backgrounds.
Presets
Each template comes with 3 color presets designed to look good within that template's aesthetic. Access presets from Settings → Appearance → Colors → Presets.
Fonts
INFO
Requires Blaze+ plan or above
Go to Settings → Appearance → Typography.
| Setting | Options |
|---|---|
| Display font | Bockhold Bold (default), Barlow Condensed, Rajdhani, Syne, Bebas Neue |
| Body font | DM Sans (default), Inter, IBM Plex Sans, Lato |
| Monospace font | JetBrains Mono (default), IBM Plex Mono, Courier Prime |
All fonts are loaded from Google Fonts and do not affect page performance.
Custom CSS
INFO
Requires Blaze++ plan
For full visual control, inject custom CSS from Settings → Appearance → Custom CSS.
Your CSS is appended after the template's stylesheet. Use CSS custom properties to override values:
:root {
--accent: #ff6b35;
--surface: #1a1a2e;
}
.hero-title {
font-size: 96px;
letter-spacing: -0.04em;
}
WARNING
Custom CSS is applied globally. Test changes carefully as they may affect layouts on multiple pages.