v2.4.0 — the 10x builder upgrade
The 10x builder upgrade
One command now ships a $100k-look redesign with a typographic voice, an OKLCH palette system, generative art direction, composition bands, and a self-critiquing Auto.
What's new
- Typographic voices — editorial, grotesque, techno, serifClassic, highContrast, expressive, monoForward — picked from the source's profile + seed +
--brief, with a fluid type scale and 4/8 spacing rhythm. Default output stays 100% offline;--web-fontsopts into Google Fonts. - OKLCH palette system — the source accent is hue-rotated into two harmonious role colors with lightness ramps, contrast-enforced, referenced via
--a2/--a3CSS variables. - Generative art direction — aurora mesh fields, data-wash numbers, halftone dot grids, anchor constellations, CSS-3D isometric stacks, plus cursor spotlight / tilt cards / count-up micro-interactions on every token.
- Composition bands — stats, bento, quote, CTA, marquee, footer archetypes; webpage/landing/infographic/showcase now compose instead of hard-coding one page.
- Self-critiquing Auto — draws 3 directions, scores against a 136-point design battery (type scale, art, motion, palette, fidelity, landmarks), re-rolls weak draws, and reports voice + design score.
--emitwritesdesign-token.json+quality-report.json. - Plan hook —
--plan '{"token":"landing","voice":"grotesque"}'lets a model harness steer the deterministic pipeline. - Playground — Auto shows three drawn directions with scores; pick one or hit ↻ Recreate.
- Content intelligence — extraction adds images, tables, tone, reading time, script detection.
- Housekeeping — removed superseded legacy artifacts; regenerated all end-user examples + GIFs through the new engine.
Validation
- 55/55 unit tests · 15-token audit · benchmark 100/100 gate · gold audit 0 failures
- Fresh engine output passes the gold craft audit · all workflow YAMLs parse
Try it: npx reimagine-it --auto -i page.html -o redesign.html · playground: https://kayforkind.github.io/reimagine-it/#playground
🛒 GitHub Actions Marketplace
This release publishes the reimagine-it Design Health action to the GitHub Actions marketplace.
Quick start
- uses: Kayforkind/reimagine-it@v2.4.0
with:
path: "**/*.html"What it checks
| Category | Checks |
|---|---|
| Typography | Hierarchy levels, text measure, missing display fonts |
| Palette | Off-palette accents, unstyled ::selection, >5 non-neutral colors |
| Motion | Missing prefers-reduced-motion, missing :focus-visible, non-compositor animation |
| Content | Blank plates, placeholder labels, fabricated content |
| Structure | No hero SVG, missing landmarks, broken images |
| Performance | Missing content-visibility, CLS risk, DOM depth |
18 deterministic rules. No LLM. No API key.
📊 Measured quality (auto-generated)
| Direction | Fidelity (title kept) | Usability (quality /100) | Content art (glyphs/donut/bars/prism) |
|---|---|---|---|
webpage |
18/18 | 100/100 | 5.0 |
landing |
18/18 | 100/100 | 8.0 |
dashboard |
18/18 | 100/100 | 6.5 |
infographic |
18/18 | 100/100 | 5.0 |
cinematic |
18/18 | 100/100 | 5.0 |
artistic |
18/18 | 100/100 | 6.0 |
photography |
18/18 | 100/100 | 6.0 |
svg |
18/18 | 100/100 | 6.0 |
3js |
18/18 | 100/100 | 2.0 |
simulation |
18/18 | 100/100 | 5.0 |
glass |
18/18 | 100/100 | 5.0 |
editorial |
18/18 | 100/100 | 2.0 |
motion |
18/18 | 100/100 | 6.0 |
gradient |
18/18 | 100/100 | 5.0 |
showcase |
18/18 | 100/100 | 5.0 |
| Output diversity: 14.8% mean pairwise difference between directions on the same source — no two tokens produce the same page. | |||
Coverage: 60 generated pages (15 tokens × 4 sources), all audited structurally. Regenerate with node scripts/benchmark-tokens.js. |