Butter light,
engineered.

Concept

The city is still blue.
The marble is already gold.

Maison Feuilletée treats a bakery morning as quiet theatre. The opening counter is pale marble split by a hard wedge of butter-yellow oven light. Against it, a large code-drawn croissant behaves like a specimen: five rolled segments, caramelised tips, lacquer highlights and a measured batch stamp. The copy borrows from a baker’s notebook. Humidity, dough temperature, flour provenance and exact times make the invented maison feel observed rather than advertised.

The page alternates between appetite and evidence. Cream retail space gives way to a dark copper technical room; the vitrine becomes a glass shelf rather than a row of cards; the bake becomes a six-column night ledger. Raspberry marks live states, pistachio cools the sweets, and blue-hour grey appears only as a faint edge of dawn.

Visual technique

Eighty-one layers,
made visible.

The signature sequence lives in main.js. updateScroll() maps the tall .lamination chapter to zero-to-one progress. A sticky stage holds the apparatus while drawSheet() paints a high-DPI canvas. Fine butter seams multiply at four thresholds, sinusoidal offsets shear the strata, and an alternating Bézier flap lifts from the left or right before settling. The readout switches decisively through 3, 9, 27 and 81; it never performs a meaningless count-up.

From 72% progress, drawCrumb() replaces the flat stack with a cut shell. Seven nested elliptical bands and individually distorted air cells make the concentric honeycomb readable even in a screenshot. The render loop runs only while eased scroll is settling, caps device pixel ratio at two, and cancels when document.hidden is true. Reduced-motion mode makes each state immediate.

Every vitrine piece is a bespoke inline SVG with pâte, glaze and specular paths. In the glass-case reveal, setGlass() raises a blurred condensation layer when the section enters; its brass button lets a visitor replay the reveal, while pointermove steers a local inspection light without a permanent animation loop. A separate IntersectionObserver releases clipped sections without hiding screenshot content. The two laboratory sliders call updateLab(), turning butter percentage and fold count into a flake score, sensory note, gauge and responsive alveoli sketch.

Palette & type

A precise pantry.

Playfair Display supplies the italic display voice: tight tracking, dramatic line breaks and the softness of a handwritten production note. Jost handles navigation, labels and body copy with generous uppercase spacing at small sizes. Core tokens in styles.css are --cream, --butter, --copper, --pistachio, --raspberry, --blue-hour, --serif and --sans.