A deterministic style system for brochure-quality local-business sites — built to feed Slipstream. Reverse-engineer real sites into Style-Guide presets, evaluate frameworks, and assemble field-bound sections.
One full page (Celebrate With Helena) rendered under every Preset (skin) and every Library (framework: Shoelace · Open Props · daisyUI · Pico), switchable independently. The fastest way to see all the looks at once.
Render any sample under any Preset and any Library, with the live dial/provenance panel beside it — captured vs derived vs platform-default, and the leak check.
The component-composed sections, each rendered across the four libraries side by side.
Every component stacked as a standalone dummy, filterable, on a light and a dark surface side by side — reskinned live by any teardown × framework. Also reachable via the showcase's All-components toggle.
The north-star page rendered end-to-end: all 10 sections in order, one business's data through their bindings, under any captured Style Guide. Layout × Sections × Data × Style Guide → a real page you can look at.
Reads any slipstream-sections package and computes the visual guide: data-slot ↔ field bindings (✓/✗), every style value classed (token / section-fixed / ⚠ ungoverned), and a spec sheet of business-types, pages & budget.
The input end of the pipeline: describe a new section, compose it from catalogue components, bind each slot to a real data field (new fields flagged as requests), and emit the section spec the emitter turns into a package.
A section in four states — page / alt / emphasis / inverse — all derived from the brand, aligned to slipstream-prod's Style-Guide v2. Click a chip to cycle a section's surface.
The 3-axis composer: render a Section Spec by binding niche fixtures, swap library anatomy and Style-Guide preset.
Any captured teardown's real style rendered through the 4 framework components (Shoelace · Open Props · daisyUI · Pico) with a selector — distinct component construction, not the old generic shim.
The deterministic recipe: a base framework + a captured Style Guide + a short, ordered list of deliberate deltas — each with its rationale. Toggle the changes live; copy the portable recipe to seed a Slipstream Style Preset.
All 20 frameworks with links to sites that actually use each (new tab) + honest adoption tags. Includes the shortlist workshops: Web Awesome, daisyUI, Pico, Open Props.
The first ten frameworks side by side with a live Style-Guide dovetail switcher. Links through to page 2 (ten more considered systems).
Ten frameworks whose defaults carry real design opinion — shadcn-without-React, Vanilla, Primer, USWDS, Tabler and more.
Applies a sentinel Style Guide through the real theming code and asserts colour/radius/font/weight actually land — per framework, ✓/✗.
One deterministic gate over every library and teardown: pass/cross per item, the rules in plain English, and the global conventions.
Paste a URL; it mines the real CSS into a captured Style-Guide preset + character report. Each opens three sides: A (captured), B (proposed), C (derived).
Where each teardown sits on the character vector — how distinct they are from each other and from Bootstrap.
Every component in the base library, with gaps shown, cross-checked against Bootstrap & Bulma. Plus the captured presets grid.
Values captured today vs the backlog of stylistic things worth adding to future captures.
Every variable Bootstrap enumerates, beside our equivalent token — a check that ours is a finite, determined spec.
Catalogue · Library · Teardown, skin vs library-character, captured-facts-only, and the rest.
Live at components.makelabs.com.au · feeds Slipstream (slipstream-prod / slipstream-sections).
Teardowns show captured facts only; proposals live on the B-side. Frameworks are a headstart on beauty, not a commitment.