Starter
Starter
The theme every new site starts with. Clean and light, every page type works from the first minute.
heron new my-site Start from a theme, keep your content
Themes
Each theme comes with demo pages. Replace the texts and photos with yours, rebuild, and the site is yours. The theme never holds your texts, so you can switch to another one at any time.
Product
HERON
A product site with a live hero, docs links and an ecosystem map. The theme of this website, light and dark.
heron theme get heron . 
Medical
Clinic
Services, doctors, conditions and booking, in several languages. Built for clinics and private practice.
heron theme get clinic . 
Legal and business
Firm
Practice areas, team, cases and contacts for a law or business firm. Serious type, quick contact.
heron theme get firm . How a theme works
Four steps from a theme to your own site. Every step has a command you can copy.
Pick a theme
The configurator lists the themes with a short video for each. You can also pick one here and take it by name.
heron theme get clinic .
- What you get
- The theme in
theme/and its demo pages incontent/. - Pick by the site, not the colour
- A clinic theme has pages for services and doctors; a firm theme has practice areas and cases. Colours are easy to change later.
- New site or existing
- In a new folder the demo pages show the way; in an existing site your pages stay and only the look changes.
- No Docker yet? Install it first.
Look at the demo
The demo pages show what goes where. Every block on the page is a section with an anchor you can see in the file.
heron serve .
- Tip
- Open a page file next to the browser: the order of sections in the file is the order of blocks on the page.
- Live preview
- Save a file and the browser shows the change after a moment.
- Address
localhost:8000in your browser. Stop the preview with Ctrl+C.- Find a block
- A block's anchor, like
{#services}, is also in the address:localhost:8000/#services.
Replace the content
Change the texts and photos, keep the anchors. Empty sections simply disappear from the page.
heron check .
- The check
- Lists what is still demo content, which photo has no caption and which link is broken.
- New page
- Copy a demo page of the same kind, save it under a new name and change the text.
- Photos
- Put yours into
media/under the same names, or change the names in the pages. - With an agent
- «Replace the demo texts with ours» is a task for the content role. How
Build
The final build is the same for every theme.
heron build . --env prod --strict
- Switch later
- Take another theme the same way: your pages stay as they are.
- Result
- The
dist/folder: the whole site, ready to publish. Store and publish - Strict
- Any warning stops the build, so a broken link or an empty description never goes live.
Your own theme
For a designer
A theme is HTML templates, CSS and a short description file. No build tools, no framework.
- Start
- Copy the Starter theme and change it. Every page type is one template, every block is one module.
- Rules
theme.yamllists the page types and the sections each one shows. The build report names what is missing.- Light and dark
- Colours as variables in CSS; one set for each mode.
- Blocks
- Every section form has its own module. See all forms
- Guide
- Theme and design
heron docs theme | less
For an AI agent
Give your agent the designer role and a mockup: it builds the theme by the same rules and checks it with a build.
- Role
- The designer guide for your version of HERON.
- Check
- The strict build fails on a missing module, a wrong section form or a missing interface text.
- Limits
- The designer role writes only to
theme/, so your pages stay safe. - Guide
- For AI agents
heron docs designer && heron build . --strict