Make Fernlight yours — switch the mood, then fine-tune colors and type, all from the Site Editor. No code required.
The seven style variations
Fernlight ships with seven one-click looks. Go to Appearance › Editor › Styles, click a variation to preview it live, then Save to apply.
- Sage — the default; calm, leafy green.
- Ink — high-contrast, near-monochrome.
- Warm Sand — soft, warm neutral.
- Clay — earthy terracotta.
- Sky — cool, airy blue.
- Dusk — muted twilight tones.
- Dark — a low-light dark mode.
Each variation restyles the whole site at once while leaving your layout untouched.
Changing colors
Open Styles › Colors. Fernlight’s palette uses semantic roles, so you set a role once and it updates everywhere it is used:
- Contrast — primary text and dark UI.
- Muted — secondary text and captions.
- Accent — highlights, separators, buttons.
- Surface / Surface-2 — section backgrounds.
- Base — the page background.
- Invert / On-invert — dark sections and the text on them.
Because they are roles rather than one-off values, contrast and consistency are preserved automatically.
Changing fonts
Fernlight pairs Cormorant Garamond (serif headings) with DM Sans (sans body) — both self-hosted, so no request is ever made to a third-party font CDN. Adjust them under Styles › Typography. The pairing is intentionally constrained to keep long-form reading coherent.
Tips
- Start from the variation closest to your vibe, then tweak — it is less work than building a palette from scratch.
- Always click Save in the Editor to apply changes to the live site.
- Use the Editor’s revisions to roll back if a change does not land.
For the full token reference, see the Developer Reference. New here? Start with Getting Started.