Skip to content
cccskills
FreePublished on GitHub

reimagine-it-audit

Design Health — runs 19 deterministic quality checks on HTML output. Use when the user says /reimagine-it audit, "audit this page", "check design quality", or wants to verify craft-floor compliance before shipping. Catches blank plates, missing focus rings, non-compositor motion, off-palette accents, dead motion, fabricated content. No LLM, no API key. CI-ready with --json and exit codes. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

See how to install

Files included (1)

  • SKILL.md3.0 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

/reimagine-it audit

Parent: ../SKILL.md — the full Content-Derived Design engine. This sub-skill handles only the deterministic quality check.

Runs npx reimagine-it audit — 19 checks across 6 categories (src/audit.js; Python scripts/audit.py is the CI mirror):

CategoryChecksWhat it catches
Typography3Banned default fonts, type-scale range, measure > 65ch
Palette3Palette drift, transition: all, un-styled ::selection
Motion4Outline removal, missing prefers-reduced-motion, missing :focus-visible, non-compositor animation
Content4Placeholder copy, vibe adjectives, emoji farm, <br><br> spacing
Structure3CDN, external font fetch, figure system doing no work
Performance2Images without dimensions, long pages without content-visibility

Usage

# Agent
/reimagine-it audit path/to/page.html

# CLI (Node — no Python required)
npx reimagine-it audit gold/webpage/after.html
npx reimagine-it audit gold/webpage/after.html --verbose
npx reimagine-it audit gold/webpage/after.html --json

# CI mirror
python scripts/audit_all.py

Exit codes

CodeMeaning
0CLEAN — no issues
1WARNINGS — advisory only, no blockers
2FAIL — must fix before shipping

Procedure

  1. If the user passed a file path, run python scripts/audit.py <path>.
  2. If no path, run python scripts/audit_all.py to audit all gold files.
  3. Report the verdict with a summary table.
  4. For each failure, name the specific rule and the fix.
  5. If --verbose, show per-category breakdown.
  6. If --json, output machine-readable JSON for CI.

Must not

  • Use an LLM for the check — this is deterministic Python only
  • Skip the craft-floor rules (MOT-02, MOT-03 are hard blockers)
  • Report "clean" without actually running the script
  • Invent checks not in scripts/audit.py

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

Content-Derived Design — reads existing HTML and writes a stronger standalone page from headings, facts, names, dates, numbers, links, emails, and colors already in that file. CLI: npx reimagine-it --auto -i page.html -o out.html; also variations, lock, and audit. Use when the user says /reimagine-it, "reimagine it", "reinvent this", "redesign this page", "make an infographic", wants a content-aware redesign or a visual leap instead of a mood board. All 17 tokens: webpage, infographic, svg, 3js, simulation, artistic, cinematic, dashboard, photography, landing, editorial, gradient, showcase, motion, glass, lookbook, particles — plus leftover words as a brief. Also /reimagine-it audit for quality checks. The agent runs the CLI; it does not hand-author the page. Installed via npx skills add Kayforkind/reimagine-it or plugin marketplace. Not /better. Not a mood board. Does not ingest PDF, PPTX, or DOCX.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it209Updated Oct 22, 2026

Emit the content signals reimagine-it reads from an HTML file — title, anchors, proper nouns, dates, numbers, emails, links, source hex colors, and the derived palette — as JSON without generating a redesign. Use when the user says /reimagine-it extract, "what does the engine see in this page", "extract the palette", "pull the facts from this page", or wants content analysis for research, migration, or design-system work. CLI: npx reimagine-it extract -i page.html -o signals.json. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it209Updated Oct 22, 2026

Generate one Content-Derived Design direction from an HTML source, or let Auto choose the strongest direction. Use when the user says /reimagine-it generate, "redesign this page", "make it a landing page", "turn this into an infographic", names a token (all 17: webpage, infographic, svg, 3js, simulation, artistic, cinematic, dashboard, photography, landing, editorial, gradient, showcase, motion, glass, lookbook, particles), or wants a content-aware redesign instead of a mood board. CLI: npx reimagine-it --auto -i page.html -o out.html. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it209Updated Oct 22, 2026

Content-derived infographic poster — reads the source file and builds a statistical poster from the facts already in it. Not a dashboard, not a CV, not an AntV template. Uses common-scale encodings (Cleveland–McGill floor), ISOTYPE unit counts (Neurath), custom data glyphs (Lupi/Fragapane), and a lossless data table. Palette, glyphs, and composition are derived from the source's own content. No pies, donuts, gauges, 3D charts, or fabricated KPIs. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it209Updated Oct 22, 2026

Design DNA capture — extracts palette, type stack, motifs, motion, and 3D signatures from a shipped HTML file and saves them as a reusable reference pack. Use when the user says /reimagine-it lock, "lock this design", "save design DNA", "capture this look", or wants to reuse a shipped design on a different target. Locks capture palette, type, motif, and motion from a shipped HTML file. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it209Updated Oct 22, 2026

Generate several distinct design directions from one HTML source plus a contrast sheet that shows every direction side by side. Use when the user says /reimagine-it variations, "show me options", "give me three takes", "which direction works best", or wants to compare design directions before choosing one. CLI: npx reimagine-it variations -i page.html -n 4 -o review/. Part of the reimagine-it Content-Derived Design suite.

The English summary is being prepared. Showing the original description.

Kayforkind/reimagine-it209Updated Oct 22, 2026

See all skills by Kayforkind

Report a problem with this skill