About

Vonheim is a Norwegian-language booking system for a community house. This is the living style guide — the source of truth for the visual system. Tokens and primitives are documented here; complex components live under components/; real pages are mocked under preview/.

Typography

Body type is Libre Caslon Text (serif). UI chrome — buttons, form labels, table headers, meta text — is Inter (sans). Monospace is used only for the styleguide chrome itself.

Heading 1 — 2rem

Heading 2 — 1.5rem

Heading 3 — 1.25rem

Heading 4 — 1.1rem

Heading 5 — 1rem

Heading 6 — uppercase 0.875rem

A paragraph with a link, some inline code, and a small caption.

Color

Nine color tokens, grouped by role. One dominant accent (slate), two status signals (positive, critical), everything else warm neutral.

Surfaces

--color-bg

--color-surface-alt

--color-surface

Line

--color-rule

Text

--color-ink

--color-ink-muted

Accent

--color-accent

Status

--color-positive

--color-critical

Spacing

--space-xs

--space-sm

--space-md

--space-lg

--space-xl

Elements

Links and lists

An inline link inside a paragraph.

Unordered item one
Unordered item two

Ordered item one
Ordered item two

Blockquote

En kort sitatlinje, stilet med venstrekant og dempet tekst.

Code block

func eksempel() string {
  return "hei"
}

Table

Dato	Formål	Status
12. mai	Bursdagsfest	Godkjent
18. mai	Møte — borettslag	Ubekreftet
20. mai	Privat selskap	Avslått

Forms

Buttons

Inputs

Components

Badge

Ubekreftet Godkjent Avslått Avbestilt Heldag Offentlig

Detail list

Lokale: 1. etasje, Kjøkken
Kontaktperson: Kari Nordmann
E-post: kari@example.no

Filter form

Flash / auth error

Ugyldig passord. Prøv igjen.

Page header bar

The cream band between the site header and the main content. Used on every page to hold the page title and sub-nav.

Full-page components

These components have enough complexity — variants, states, or surrounding context — to warrant their own pages.