Zo is Het Papieren Theater gebouwd

Een reizend miniatuurgezelschap dat scènes uit gesneden papier speelt. De hele site is één diorama-doos: geen WebGL, geen canvas, alleen HTML, inline SVG en CSS. Het handwerk zit in de vormen zelf.

Het toneel

• Gordijnen: twee absolute panelen met een repeating-linear-gradient als plooien. Bij pageload schuiven ze open via een 2 seconden cubic-bezier transitie.
• De lijst: een dikke bruine border rond de hero als proscenium-boog, en elke scène krijgt een eigen kijkdoos met houten boven- en onderrand.

De diorama's

• Elke scène bestaat uit vier inline SVG-lagen met een data-diepte attribuut. Eén rAF-loop verschuift ze op scroll en muispositie: hoe dieper de laag, hoe sneller hij beweegt.
• Het papier-gevoel komt van drop-shadow filters tussen de lagen, alsof vellen los boven elkaar hangen.
• Het bootje dobbert en de vos sluipt met kleine oneindige CSS-keyframes, gepauzeerd bij prefers-reduced-motion.
• Alle vormen zijn met de hand geschreven SVG-paths. Geen illustratie-bibliotheek, geen gegenereerde assets.

Typografie en kleur

• Display: Fraunces met de WONK-as aan en SOFT hoog, waardoor letters licht scheef en rond vallen, als uit papier geknipt. De rode slagschaduw is een tweede vel.
• Body: Karla, warm en onopvallend.
• Palet: zaal-donker #1D1A26, papier #F5E9C9, vermiljoen #E5352B, pauwblauw #0E5F76, oker #F2A93B, roze #F5A9B8. Gouache, geen gradiënten op de vormen zelf.

Credit

Site 04 van 25 in de Vormula demo-reeks. Concept, code en copy: Claude (Fable 5), in opdracht van Vormula Studio.