Agent skill

Block Runner

by humanmade in humanmade/block-runner

Turn WordPress page content or authored design HTML into valid, native, editable Gutenberg blocks, or plan a reusable named registered block for deterministic source generation.

GPL-2.0-or-laterAuto-check passedFrontend & Design

Install Block Runner

skills CLI
$ npx skills add humanmade/block-runner --skill block-runner -a claude-code

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

GitHub CLI
$ gh skill install humanmade/block-runner block-runner --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/humanmade/block-runner.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/block-runner .claude/skills/block-runner && 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
block-runner
GitHub stars
121
Token cost
~1.8k tokens
SKILL.md length
836 words
Files
6 (incl. references)
Skills in repo
1
Repo updated
First seen
Licence
GPL-2.0-or-later

At a glance

Turn WordPress page content or authored design HTML into valid, native, editable Gutenberg blocks, or plan a reusable named registered block for deterministic source generation.

  • Creating WordPress page content
  • SKILL.md covers Pick the artifact first, Discover only missing project… and Generator boundary and…
  • Calls npx
  • Converting authored HTML

What it does

Block Runner is an agent skill from humanmade/block-runner. Turn WordPress page content or authored design HTML into valid, native, editable Gutenberg blocks, or plan a reusable named registered block for deterministic source generation. Use when creating WordPress page content or sections, converting authored HTML or a design-tool export into block markup, authoring a reusable named block in an existing WordPress project, continuing an in-scope Gutenberg component through custom PHP or editor code, understanding its block integration before generation, validating or…

Its SKILL.md is about 1.8k tokens, which your agent loads only when the skill is triggered. The skill folder holds 6 other files, including reference files (for example `references/ASSEMBLE.md`, `references/AUTHORING-PLAN.md` and `references/AUTHORING.md`). Compatibility notes: Requires Node.js ^20.19.0 || ^22.13.0 || =24.0.0 and shell access. An uncached npx run requires npm registry access.

It sits in Frontend & Design. It works with WordPress, PHP, TypeScript and Node.js. The repository describes itself as: Easily convert HTML into WordPress Blocks. The licence is GPL-2.0-or-later.

When your agent uses it

  • Creating WordPress page content
  • Converting authored HTML
  • A design-tool export into block markup
  • Authoring a reusable named block in an existing WordPress project

Example prompts

  • “/block-runner”

Requirements

  • Node.js
  • Compatibility (from SKILL.md): Requires Node.js ^20.19.0 || ^22.13.0 || >=24.0.0 and shell access. An uncached npx run requires npm registry access.

What it can do on your machine

Read from SKILL.md and the folder at commit d800020. 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.

  • Compatibility

    Requires Node.js ^20.19.0 || ^22.13.0 || >=24.0.0 and shell access. An uncached npx run requires npm registry access.

    From compatibility in the SKILL.md frontmatter.

Context cost

Block Runner loads about 1.8k tokens when it runs, and up to ~21k if it reads all its reference files. Until then it costs about 180 tokens; SKILL.md has 836 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~180
When it runs · the whole SKILL.md, loaded when a task matches
~1.8k
With references · SKILL.md plus every file in references/, read only if the agent opens them
~21k

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 humanmade/block-runner at commit d800020, republished under its GPL-2.0-or-later licence (© humanmade). 836 words, ~1,790 tokens.

Download SKILL.mdSave it as .claude/skills/block-runner/SKILL.md (or your agent's skills folder). This skill also uses 5 other files; get the full folder from GitHub.
name
block-runner
description
Turn WordPress page content or authored design HTML into valid, native, editable Gutenberg blocks, or plan a reusable named registered block for deterministic source generation. Use when creating WordPress page content or sections, converting authored HTML or a design-tool export into block markup, authoring a reusable named block in an existing WordPress project, continuing an in-scope Gutenberg component through custom PHP or editor code, understanding its block integration before generation, validating or repairing Gutenberg markup, or before writing blocks to WordPress. Do not use for general WordPress administration, unrelated plugin or theme code, frontend-scraped HTML, or non-WordPress HTML.
compatibility
Requires Node.js ^20.19.0 || ^22.13.0 || >=24.0.0 and shell access. An uncached npx run requires npm registry access.
license
GPL-2.0-or-later

Block Runner

Pick the artifact first

Choose the visible result before discovering a project. Read the named first reference, use the condition, and stop at its stated boundary. Do not load a construction taxonomy for a self-contained page-content or markup-repair task.

Requested artifactFirst referenceUse whenCompletion boundary
Native page or post structureASSEMBLE.md, then GUIDE.md §5–6You are inventing a page section and have no authored HTML whose styling must survive. Run npx -y block-runner@latest assemble - --json with an intent tree.Valid native page post_content, delivered to the agreed destination.
Page or post content from authored design HTMLGUIDE.md §4The supplied source is authored HTML; use npx -y block-runner@latest convert - --json when its CSS matters.Valid native page post_content plus reported fallbacks and styling limits. Never treat frontend-scraped rendered HTML as authored input.
Reusable, named static registered block sourceAUTHORING.mdThe requested result is a static namespace/slug block in code.Confirmed source at its exact retained destination; build, integration, and WordPress proof remain separate. The complete plan in AUTHORING-PLAN.md is an advanced route, not a prerequisite.
Custom PHP renderer or editor behaviour in an existing projectGUIDE.md §1.1Static generation cannot satisfy the requested component.Continue in project-owned code; retain a useful native subtree only when it genuinely helps. Inspect CONSTRUCTION-PATTERNS.md only when project facts needed for that implementation are missing.
Supplied block markup to repair or checkGUIDE.md §5Markup already exists and must be safe to save.validate → fix → validate; do not save a hard-invalid result.

If “reusable section” does not say whether it is page post_content or a named registered source block, ask that one artifact question before writing. Do not use this skill for unrelated WordPress administration, non-WordPress HTML, or frontend-scraped HTML presented as source.

Discover only missing project facts

For a component that belongs in an existing project, use GUIDE.md §0 after the artifact route is clear. Reuse established facts and inspect only the relevant source and site context needed for this change. Existing-plugin integration needs inspection; a self-contained paragraph repair does not. Use relevant facts to recommend reuse, supported generation or a developer handoff. Recognizing a route does not add generator support. Ask only for choices that the request and repository do not answer; use structured questions if your harness supports them, otherwise ask in plain language.

Show full SKILL.md (452 more words)Show less

Generator boundary and continuation

  • A generated registered-block plan is declarative only. Do not use React/JSX, PHP, a complete block.json, generated CSS, or <!-- wp:… --> delimiters as a substitute for that generator. Its model proposal makes reviewable semantic choices; deterministic code produces the executable files. See references/AUTHORING.md for the full proposal and confirmation contract.
  • Continue project-owned work normally when static generation does not fit. If the component needs a custom PHP renderer or editor behaviour, inspect its project contracts and implement that code in the project. Do not generate a static shell that will immediately be replaced, and do not require later regeneration of ordinary project-owned source. Retain any useful native subtree from assemble or convert, and state precisely what Block Runner contributed. For example: “Block Runner cannot generate this custom renderer and editor. I’ll implement those in the project and use its supported helpers where useful.” See references/GUIDE.md §1.1.
  • Finish the job. Deliver page markup or source to its agreed retained destination, never a temporary folder. Explain remaining wiring and unverified checks; see references/AUTHORING.md and references/GUIDE.md §6. For page content, paste through Options ⋮ → Code editor (Ctrl+Shift+Alt+M), not the visual editor.
  • When you produce markup and no destination is agreed, the reply is the delivery. Put the complete markup in the reply before you summarise it; a file you wrote along the way is where the generator put its output, never where the job ended. Do not state a block count, a validation verdict or paste instructions for markup the reply does not contain: a confident description of output the user cannot see reads as success and is the one failure they cannot spot.
  • Prefer --json for automation. Text output includes concise reasons and selected repair context, but JSON preserves the complete machine-readable report.
  • Never hand-write <!-- wp:... --> markup. That is how invalid output happens. Describe structure instead and let assemble build it.
  • A core/html fallback is not a success. It means that part is an uneditable blob. Check the report and tell the user.
  • Use assemble for explicit native styles; use convert to interpret authored HTML/CSS. Intent attributes can carry theme presets, spacing, layout and block style classes. See references/ASSEMBLE.md#native-styles-and-layout; verify presentation in the target theme.
  • Name the proof claim and retain its receipt. Headless markup checks do not establish custom PHP, custom controls, frontend behaviour, or editor persistence. See references/GUIDE.md §1.1 and references/AUTHORING.md.
  • Passwords go in --wp-app-password-env <NAME>, never in argv.
  • It is an assist, not a gate. If the tool is unavailable, fall back to your own checks and say so — never block the user on it.

Block structure rules, the full node schema and per-section mappings are in references/ASSEMBLE.md. Token and media resolution, exit codes, and failure posture are in references/GUIDE.md.

© humanmade, GPL-2.0-or-later. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

SKILL.md and 5 other files (references) in skills/block-runner of humanmade/block-runner.

  • SKILL.md
  • references/ASSEMBLE.md
  • references/AUTHORING-PLAN.md
  • references/AUTHORING.md
  • references/CONSTRUCTION-PATTERNS.md
  • references/GUIDE.md

Open the folder on GitHubat commit d800020

Compare with similar skills

Block Runner 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.

Block Runner compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
Block Runner this skillhumanmade/block-runner121—~1.8kAutomated safety check: PassGPL-2.0-or-later
Deploy To Hostinghostinger/api-mcp-server159—~2.7kAutomated safety check: NotesMIT
Ink Tui Wizardnovuhq/novu40k—~1.9kAutomated safety check: PassMIT
Tidyfactor StylerTidyFactor/Styler118—~1.7kAutomated safety check: PassApache-2.0
Fumadocsbetter-notify/better-notify313—~2.3kAutomated safety check: PassMIT
Spotpatchhuanglvjing/spotpatch134—~998Automated safety check: PassMIT

Similar skills

  • Deploy To Hosting

    hostinger/api-mcp-server

    Deploy an existing project to a website on Hostinger web hosting (Shared, Cloud or Agency plans) and keep it deployed: picks the right deploy for static sites, Node.js apps (Next.js, Nuxt, Express…

    159 GitHub stars~2.7k tokensUpdated yesterday
    DevOps & CloudAuto-check: notes
  • Ink Tui Wizard

    novuhq/novu

    Build terminal user interfaces (TUIs) using Ink (React for CLIs) and @inkjs/ui with a reactive, session-driven wizard pattern.

    40k GitHub stars~1.9k tokensUpdated today
    Frontend & DesignAuto-check passed
  • Tidyfactor Styler

    TidyFactor/Styler

    Production framework styler and surgical RTL UI polish engine with Contextual Decision Layer (CDL).

    118 GitHub stars~1.7k tokensUpdated 1 mo ago
    Frontend & DesignAuto-check passed
  • Fumadocs

    better-notify/better-notify

    A skill your agent uses when writing MDX documentation pages for a Fumadocs project — frontmatter, meta.json, page ordering, and fumadocs-ui React components available inside MDX content.

    313 GitHub stars~2.3k tokensUpdated 1 mo ago
    Frontend & DesignAuto-check passed
  • Spotpatch

    huanglvjing/spotpatch

    为 React 项目建立从浏览器页面元素到精确 JSX/TSX 源码、结构化上下文与可审阅修改的 SpotPatch 工作流。用户提到 SpotPatch、截图沟通前端修改、页面元素定位源码、Vite 或 Next.js 接入、组件数据链路、结构化 Prompt、AI 补丁审阅、安装检查或故障排查时使用此技能。

    134 GitHub stars~998 tokensUpdated 9 days ago
    Frontend & DesignAuto-check passed
  • Rssmonster Browser

    pietheinstrengholt/rssmonster

    Use Codex browser capabilities to inspect and validate the RSSMonster UI in a real browser.

    564 GitHub stars~3.4k tokensUpdated yesterday
    Frontend & DesignAuto-check passed

Questions about Block Runner

What does Block Runner do?

Turn WordPress page content or authored design HTML into valid, native, editable Gutenberg blocks, or plan a reusable named registered block for deterministic source generation. Block Runner is an agent skill from humanmade/block-runner. Turn WordPress page content or authored design HTML into valid, native, editable Gutenberg blocks, or plan a reusable named registered block for deterministic source generation.

When should I use Block Runner?

Block Runner fits situations like: creating WordPress page content; converting authored HTML; A design-tool export into block markup; authoring a reusable named block in an existing WordPress project.

How do I install Block Runner in Claude Code?

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

How do I install Block Runner in Codex?

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

Can I use Block Runner 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 humanmade/block-runner --skill block-runner -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/block-runner, .gemini/skills/block-runner, .github/skills/block-runner and .opencode/skills/block-runner in your project.

What does Block Runner need to run?

Going by SKILL.md and its folder, Block Runner needs the command-line tools its instructions call (npx). Our summary lists: Node.js. Compatibility (from SKILL.md): Requires Node.js ^20.19.0 || ^22.13.0 || >=24.0.0 and shell access. An uncached npx run requires npm registry access..

Does Block Runner 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 Block Runner 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 Block Runner use?

Block Runner is published under the GPL-2.0-or-later licence (declared in SKILL.md). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does Block Runner use?

About 1.8k tokens (SKILL.md is roughly 7.2k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full. Its references folder adds about 19k tokens, read only when the agent opens those files.

What are the alternatives to Block Runner?

Skills that share tags, products or a category with Block Runner: Deploy To Hosting (hostinger/api-mcp-server, 159 stars), Ink Tui Wizard (novuhq/novu, 40k stars), Tidyfactor Styler (TidyFactor/Styler, 118 stars) and Fumadocs (better-notify/better-notify, 313 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains Block Runner?

humanmade (a GitHub organization) maintains it in humanmade/block-runner, which has 121 GitHub stars. The repository was last updated on October 4, 2026.

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