Agent skill

Reimagine It Extract

by Kayforkind in Kayforkind/reimagine-it

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…

MITAuto-check passedFrontend & Design

Install Reimagine It Extract

skills CLI
$ npx skills add Kayforkind/reimagine-it --skill reimagine-it-extract -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install Kayforkind/reimagine-it reimagine-it-extract --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/Kayforkind/reimagine-it.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/reimagine-it/extract .claude/skills/reimagine-it-extract && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
reimagine-it-extract
GitHub stars
205
Token cost
~819 tokens
SKILL.md length
207 words
Files
1
Skills in repo
7
Repo updated
First seen
Licence
MIT

At a glance

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…

  • Works in 3 steps: Run it before any redesign when the user… → To audit honesty: every dates, numbers,… → Use it for migration/research: the…
  • The user says /reimagine-it extract
  • SKILL.md covers Usage, Procedure and Must not
  • Calls npx

What it does

Reimagine It Extract is an agent skill from Kayforkind/reimagine-it. 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…

Its SKILL.md is about 820 tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It sits in Frontend & Design, covering Design systems. The repository describes itself as: Kayforkind Content-Derived Design CLI. HTML in, standalone HTML out from the source's own nouns, dates, numbers, and colors. Not the reimagineit.ai interview SaaS. The licence is MIT.

When your agent uses it

  • The user says /reimagine-it extract
  • What does the engine see in this page
  • Extract the palette
  • Pull the facts from this page

Example prompts

  • “what does the engine see in this page”
  • “extract the palette”
  • “pull the facts from this page”
  • “/reimagine-it-extract”

Requirements

  • Node.js

Workflow steps

3 steps, taken from the first numbered list in SKILL.md.

  1. Run it before any redesign when the user asks "what would you even use
  2. To audit honesty: every dates, numbers, emails, and links entry
  3. Use it for migration/research: the payload is a stable, typed summary of

What it can do on your machine

Read from SKILL.md and the folder at commit e8c9378. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    Shell commands in SKILL.md call:

    • npx

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md. Its commands use npx, which can reach the network depending on how they are called.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

Reimagine It Extract loads about 819 tokens when it runs. Until then it costs about 140 tokens; SKILL.md has 207 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~140
When it runs · the whole SKILL.md, loaded when a task matches
~819

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from Kayforkind/reimagine-it at commit e8c9378, republished under its MIT licence (© Kayforkind). 207 words, ~819 tokens.

Download SKILL.mdSave it as .claude/skills/reimagine-it-extract/SKILL.md (or your agent's skills folder).
name
reimagine-it-extract
description
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.
license
MIT
metadata.author
Kayforkind
metadata.version
2.15.0
metadata.parent
reimagine-it
metadata.hosts
claude-code, cursor, codex, copilot, gemini-cli
keywords
content-extraction, palette-extraction, content-analysis, design-signals, content-derived-design
category
Data
capabilities
content-signal-extraction, palette-derivation, fact-inventory
trigger_phrases
/reimagine-it extract, what does the engine see, extract the palette, pull the facts from this page, analyze this page's content

/reimagine-it extract

Parent: ../SKILL.md — the full Content-Derived Design engine. This sub-skill handles only the extraction surface — the honesty layer the whole method stands on.

The redesign is only as honest as its extraction. This verb emits exactly what the engine reads, as JSON, without generating anything: title, profile, density, derived palette, anchors, proper nouns, headings, dates, numbers, emails, links, and source hex colors. Every extracted fact exists in the source — property-tested against hostile and malformed input.

Usage

bash
npx reimagine-it extract -i page.html -o signals.json
cat page.html | npx reimagine-it extract -o -        # stdin → stdout
npx reimagine-it extract -i page.html --full -o signals.json  # + prose

Payload shape (default):

json
{
  "source": "page.html",
  "title": "…",
  "profile": "restaurant | saas | civic | …",
  "density": "sparse | medium | dense",
  "palette": { "ground": "…", "accent": "…", "muted": "…", "surface": "…", "ink": "…" },
  "anchors": ["…"],
  "properNouns": ["…"],
  "headings": ["…"],
  "dates": ["…"],
  "numbers": ["…"],
  "emails": ["…"],
  "links": ["…"],
  "sourceHex": ["#6B3A2A"],
  "counts": { "paragraphs": 4, "listItems": 16 }
}

--full adds paragraphs and items (the raw prose arrays).

Procedure

  1. Run it before any redesign when the user asks "what would you even use from this page?" — the JSON answers with the engine's actual inputs.
  2. To audit honesty: every dates, numbers, emails, and links entry must be findable in the source. Nothing else is allowed to appear.
  3. Use it for migration/research: the payload is a stable, typed summary of a page's content — no redesign attached.

Must not

  • Add facts not present in the payload to any downstream summary
  • Present the derived palette as colors the source declared — hex colors in sourceHex were in the source; the rest is derivation
  • Round or "clean up" extracted numbers and dates; they are quotes

Part of reimagine-it — MIT.

© Kayforkind, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in skills/reimagine-it/extract of Kayforkind/reimagine-it.

Open the folder on GitHubat commit e8c9378

Compare with similar skills

Reimagine It Extract next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

Reimagine It Extract compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Reimagine It Extract this skillKayforkind/reimagine-it205—~819Automated safety check: PassMIT
Impeccablebestofjs/bestofjs3.1k26 repos~2.6kAutomated safety check: PassMIT
Figma Design System Builderwarpdotdev/warp65k2 repos~4.4kAutomated safety check: PassAGPL-3.0
Figma use_figma Plugin API Ruleswarpdotdev/warp65k4 repos~4.4kAutomated safety check: PassAGPL-3.0
UI StylingOhh-889/skyroc79513 repos~2.5kAutomated safety check: PassMIT
Shadcnsupabase/evals14442 repos~4.5kAutomated safety check: PassApache-2.0

Similar skills

  • Impeccable

    bestofjs/bestofjs

    A skill your agent uses when the user wants to design, redesign, shape, critique, audit, polish, clarify, distill, harden, optimize, adapt, animate, colorize, extract, or otherwise improve a…

    3.1k GitHub starsUsed in 26 repos~2.6k tokens
    Frontend & DesignAuto-check passed
  • Builds or updates a design system in Figma from a codebase in ordered phases: discovery, variables and tokens, components, theming and documentation, with checkpoints.

    65k GitHub starsUsed in 2 repos~4.4k tokens
    Frontend & DesignAuto-check passed
  • Required groundwork before any use_figma call: the rules and reference files for running JavaScript in a Figma file through the Plugin API without common failures.

    65k GitHub starsUsed in 4 repos~4.4k tokens
    Frontend & DesignAuto-check passed
  • UI Styling

    Ohh-889/skyroc

    Create beautiful, accessible user interfaces with shadcn/ui components (built on Radix UI + Tailwind), Tailwind CSS utility-first styling, and canvas-based visual designs.

    795 GitHub starsUsed in 13 repos~2.5k tokens
    Frontend & DesignAuto-check passed
  • Shadcn

    supabase/evals

    Official

    Manages shadcn components and projects — adding, searching, fixing, debugging, styling, and composing UI.

    144 GitHub starsUsed in 42 repos~4.5k tokens
    Frontend & DesignAuto-check passed
  • Design System

    Ohh-889/skyroc

    Token architecture, component specifications, and slide generation.

    795 GitHub starsUsed in 11 repos~1.7k tokens
    Frontend & DesignAuto-check passed

More from Kayforkind/reimagine-it

  • Reimagine It

    Kayforkind/reimagine-it

    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.

    205 GitHub stars~11k tokensUpdated 4 days ago
    Auto-check passed
  • Reimagine It Audit

    Kayforkind/reimagine-it

    Design Health — runs 19 deterministic quality checks on HTML output.

    205 GitHub stars~756 tokensUpdated 4 days ago
    Auto-check passed
  • Reimagine It Generate

    Kayforkind/reimagine-it

    Generate one Content-Derived Design direction from an HTML source, or let Auto choose the strongest direction.

    205 GitHub stars~876 tokensUpdated 4 days ago
    Auto-check passed
  • Reimagine It Lock

    Kayforkind/reimagine-it

    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.

    205 GitHub stars~959 tokensUpdated 4 days ago
    Auto-check passed
  • Reimagine It Variations

    Kayforkind/reimagine-it

    Generate several distinct design directions from one HTML source plus a contrast sheet that shows every direction side by side.

    205 GitHub stars~680 tokensUpdated 4 days ago
    Auto-check passed
  • Reimagine It Infographic

    Kayforkind/reimagine-it

    Content-derived infographic poster — reads the source file and builds a statistical poster from the facts already in it.

    205 GitHub stars~1.1k tokensUpdated 4 days ago
    Auto-check passed

Questions about Reimagine It Extract

What does Reimagine It Extract do?

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…. Reimagine It Extract is an agent skill from Kayforkind/reimagine-it. 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.

When should I use Reimagine It Extract?

Reimagine It Extract fits situations like: the user says /reimagine-it extract; what does the engine see in this page; extract the palette; pull the facts from this page.

How do I install Reimagine It Extract in Claude Code?

Run `npx skills add Kayforkind/reimagine-it --skill reimagine-it-extract -a claude-code`. Or copy the skill folder (skills/reimagine-it/extract in Kayforkind/reimagine-it) into .claude/skills/reimagine-it-extract in your project. Claude Code loads it when a task matches its description.

How do I install Reimagine It Extract in Codex?

Run `npx skills add Kayforkind/reimagine-it --skill reimagine-it-extract -a codex`. Or copy the skill folder (skills/reimagine-it/extract in Kayforkind/reimagine-it) into .agents/skills/reimagine-it-extract in your project. Codex loads it when a task matches its description.

Can I use Reimagine It Extract in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add Kayforkind/reimagine-it --skill reimagine-it-extract -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/reimagine-it-extract, .gemini/skills/reimagine-it-extract, .github/skills/reimagine-it-extract and .opencode/skills/reimagine-it-extract in your project.

What does Reimagine It Extract need to run?

Going by SKILL.md and its folder, Reimagine It Extract needs the command-line tools its instructions call (npx). Our summary lists: Node.js.

Does Reimagine It Extract access the network?

SKILL.md contains no URLs. Its commands use npx, which can reach the network depending on how they are called. This is read from the text; nothing was executed.

Is Reimagine It Extract safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does Reimagine It Extract use?

Reimagine It Extract is published under the MIT licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Reimagine It Extract use?

About 819 tokens (SKILL.md is roughly 3.3k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to Reimagine It Extract?

Skills that share tags, products or a category with Reimagine It Extract: Impeccable (bestofjs/bestofjs, 3.1k stars), Figma Design System Builder (warpdotdev/warp, 65k stars), Figma use_figma Plugin API Rules (warpdotdev/warp, 65k stars) and UI Styling (Ohh-889/skyroc, 795 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Reimagine It Extract?

Kayforkind (a GitHub user) maintains it in Kayforkind/reimagine-it, which has 205 GitHub stars. The repository holds 7 skills in this directory. The repository was last updated on October 6, 2026.

Source: Kayforkind/reimagine-it on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.