Theme Style Guide
Een overzicht van alle typografie, kleuren en spacing instellingen
Typografie
Headings
Heading 1 — Lorem ipsum dolor sit amet
Heading 2 — Consectetur adipiscing elit
Heading 3 — Sed do eiusmod tempor incididunt
Heading 4 — Ut labore et dolore magna aliqua
Heading 5 — Ut enim ad minim veniam
Heading 6 — Quis nostrud exercitation ullamco
Font Sizes
Small (0.875rem): Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Medium (1.25rem): Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Large (1.5rem): Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Extra Large (2.75rem): Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Huge (4.5rem): Lorem ipsum dolor sit amet.
Text Styles
Regular: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
Bold tekst: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Italic tekst: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Bold Italic tekst: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
Links
Dit is een paragraaf met een hyperlink naar een andere pagina. Links zijn standaard burgundy-rose en worden navy-blue bij hover.
Kleuren
Color Palette
Navy Blue
#313955
Navy Blue Light
#8a8da0
Burgundy Rose
#A33751
Light Pink
#E8B4BC
Light Gray
#E5E5E5
Medium Gray
#C4C4C4
White
#FFFFFF
Black
#000000
Tekstkleuren
Navy Blue tekst: Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Navy Blue Light tekst: Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Burgundy Rose tekst: Lorem ipsum dolor sit amet, consectetur adipiscing elit.
Spacing
De volgende spacing presets zijn beschikbaar in het thema:
XS — 0.5rem (8px)
Small — 1rem (16px)
Medium — 2rem (32px)
Large — 3rem (48px)
XL — 6rem (96px)
XXL — 10rem (160px)
Buttons
Buttons met kleuren
Lists
Unordered List
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Sed do eiusmod tempor incididunt
- Nested item one
- Nested item two
- Ut labore et dolore magna aliqua
Ordered List
- Lorem ipsum dolor sit amet
- Consectetur adipiscing elit
- Sed do eiusmod tempor incididunt
- Nested item one
- Nested item two
- Ut labore et dolore magna aliqua
Quotes
Quote
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris.
— Studio Harm Hasenaar
Pullquote
Wij ontwerpen totaalbeleving voor musea en bezoekerscentra, van concept tot realisatie.
— Studio Harm Hasenaar
Layout Widths
Content Width: 800px — Dit is de standaard content breedte.
Wide Width: 1200px — Dit element gebruikt de wide alignment.
Full Width: Dit element strekt zich uit over de volledige breedte van het scherm.
Separators
Default:
Wide:
Dots:
Images
Gallery
Tables
Standaard tabel
| Project | Locatie | Jaar | Status |
|---|---|---|---|
| Tuinkamer | Muiderslot | 2024 | Afgerond 2025 |
| Film over Volendam | Visafslag Volendam | 2023 | Afgerond |
| Bezoekerscentrum | Fort Pampus | 2024 | In ontwikkeling |
| Interactieve Tentoonstelling | Zuiderzeemuseum | 2025 | Concept |
| Footer |
Gestreepte tabel
| Naam | Rol | Specialisatie |
|---|---|---|
| Harm Hasenaar | Creative Director | Conceptontwerp, Interieurarchitectuur |
| Arthur Willemse | Conceptontwerp | Tentoonstellingsmaker |
| Sandra Haverlach | Vormgeving | Interaction Design |
| Lila Hasenaar | Grafische vormgeving | Animatie, Illustratie |
| Tim Heessels | Gamedesign | Developer |
Tabel met achtergrondkleur
| Dienst | Omschrijving | Prijs |
|---|---|---|
| Conceptontwerp | Ontwikkeling van het creatieve concept | Op aanvraag |
| Interieurarchitectuur | Ruimtelijk ontwerp en inrichting | Op aanvraag |
| Interactie Design | Digitale interactieve elementen | Op aanvraag |
| Realisatie | Volledige uitvoering van het project | Op aanvraag |