How do I customize my blog theme in VeloCMS?
Adjust fonts, brand colors, and layout density without touching code — VeloCMS exposes the most impactful design variables through the Theme settings panel.
VeloCMS lets you adjust your blog's brand colors, primary font, and layout density from Admin → Themes → Customize, without writing a single line of CSS. Changes are stored as theme preset overrides and applied as CSS custom properties at runtime — meaning they're instant, reversible, and never break the base theme.
Which design properties can I change without code?
The Customize panel exposes three categories of settings. Brand colors let you set your primary accent color, background, and text color — all stored as OKLCH values so they adapt cleanly to dark mode. Typography lets you pick from the curated font pairing list (each pair is a heading font + body font selected for readability and performance). Layout density gives you a compact, comfortable, or spacious reading width. These three levers cover the most visible parts of your blog's personality without requiring any developer involvement.
How do I set my own brand color?
Open Admin → Themes → Customize and click the primary color swatch. A color picker opens with a hex input field — paste your brand color's hex code (for example #E63946) and the preview on the right updates live. VeloCMS converts your hex to OKLCH internally so the color looks consistent across different monitor calibrations and in dark mode. Hit Save Changes and the new color takes effect immediately for all visitors. If you want to reset to the theme's default color, just clear the custom color field and save.
What fonts are available and how do I switch them?
VeloCMS ships with seven carefully chosen font pairs, each covering both heading and body type. The pairs are pre-optimized for web performance — fonts are loaded from Google Fonts with display=swap so they never block your page render. To switch, open the Typography section in the Customize panel, click any pair to preview it in the live demo on the right, and save. Font swaps propagate to all your existing posts immediately — there's no per-post font setting because inconsistent typography is one of the fastest ways to make a blog look unprofessional.
Can I inject custom CSS for advanced tweaks?
Pro and Business plan subscribers can paste custom CSS from Admin → Themes → Custom CSS. This CSS is injected at the bottom of the global stylesheet, so your rules override the theme defaults with normal CSS specificity. Keep custom CSS minimal — overrides that duplicate existing CSS custom properties (like --vb-color-primary) are unnecessary since the Customize panel already sets those. The most legitimate uses are font-size nudges, hiding specific UI elements, or adding a custom background pattern. The Business plan also allows custom JavaScript via the Head & Footer Code panel for third-party embeds that require script injection.
Custom CSS is scoped to your blog tenant and never affects other VeloCMS blogs. However, very aggressive CSS can accidentally hide essential UI like the navigation bar or post title. If your blog looks broken after a CSS edit, clear the custom CSS field and save to restore the theme defaults.