DEV Community

Cover image for reimagine-it v2.4.3 — one command, every page's CSS restored
K Merchant
K Merchant

Posted on

reimagine-it v2.4.3 — one command, every page's CSS restored

#agents #design #html #opensource

🛠️ v2.4.3 — every generated page just got its CSS back

This release fixes the deepest bug the engine has ever shipped: every token was embedding a literal undefined where its shared CSS should be. The token dispatcher ran before the engine built its CSS systems, so pages silently lost their mesh aurora fields, giant data-wash numbers, glyph tiles, donut charts, stats bands, bento grids, and band marquees/footers — while still passing the craft audit (the audit inspects body markup, not CSS). One command, one-line fix, and every output grows its full art system:

  • No more undefined in any of the 15 tokens — outputs grew by the complete band/art CSS (a webpage render went 15 KB → 24 KB).
  • Background numbers no longer glue together — 336,000 + 40,000 used to render as one clipped 336,00040,00; they now spread, cap at 32vw, and ellipsize on phones.
  • The webpage token's isometric stamp floats again — it was the only token missing the shared art CSS.
  • Palette gate fixed — source brand hexes like #FF3366 no longer count as two colors when the engine lowercases them into CSS vars; a 1500-cell sweep (100 sources × 15 tokens) passes 100% with 0 errors, fidelity avg 99.6%.
  • Regression-locked — a new unit test fails if any token output ever embeds a literal undefined or drops its shared CSS systems again (59/59 tests green).

All seven end-user examples, the gallery, and the live playground were regenerated through the fixed engine — the visuals on kayforkind.github.io/reimagine-it are what the engine actually produces now.

What it is

reimagine-it is a one-command agent skill that redesigns an existing HTML file into a beautiful, working artifact — using only the nouns, dates, colors, links, and numbers already in that file. No mood boards, no gold layouts with swapped labels. The output is a real page you can open.

npx reimagine-it@2.4.3 -i mypage.html -o redesigned.html
Enter fullscreen mode Exit fullscreen mode

What's new in v2.4.2

1. Source fidelity floor raised to 80% across every token

Before v2.4.2, 61 of 105 token×source cells fell below 80% fidelity — the engine preferred headings over real source anchors, so phrases like "Venator Become" or "Arcade Tee" never rendered. Now:

  • Anchors = headings + source anchors, deduplicated — every clickable phrase survives.
  • All 105 token×source cells ≥80% (worst token: 80%).
  • All seven shipped examples report 100% fidelity in their auto.json reports.

2. Links and emails surface on every token

A shared Source-index footer renders all content.links and emails on every generated page — not just the webpage/landing tokens.

3. All 15 design tokens in the browser extension

The popup now exposes all 15 tokens: webpage, landing, dashboard, infographic, cinematic, artistic, photography, svg, 3js, simulation, glass, editorial, motion, gradient, showcase.

4. Docs can't drift anymore

A new docs-drift CI job regenerates the case tables and fails the build if they diverge from ground truth.

The 15 design tokens

Token What it builds
webpage Clean content-first page
landing Conversion-focused landing
dashboard KPI dashboard from facts
infographic Paper-poster argument
cinematic Film-poster energy
artistic Expressive art direction
photography Photo-led layout
svg Living SVG mark
3js WebGL orbit scene
simulation Interactive timeline
glass Glassmorphism UI
editorial Magazine layout
motion Animated micro-interactions
gradient Bold gradient arena
showcase Product showcase

Measured, not vibes

  • 57/57 unit tests pass
  • 15-token benchmark: all tokens hold the 100/100 usability bar
  • 100-source stress test: 0 errors, fidelity avg 99.7, min 80
  • 7 end-user examples at 100% fidelity

Try it — no install

Give it one HTML file. It gives you back something worth opening.

Top comments (0)