How to use the Article Prompts to Skills agent skill

What is an agent skill, and what does this one do?

An agent skill is a folder with a SKILL.md file that tells an AI agent how to perform a specific task. The agent reads the skill when your request matches its description.

When this skill is active, the agent inspects the source, lists its explicit prompts, headings and examples, and maps each one to a candidate skill. Each skill gets portable instructions, example prompts, a working HTML demo and validation steps. The agent then reports how the source mapped to the skills.

• Keeps the useful behaviour from a source and drops its brand, layout and copy.
• Creates one skill per independently reusable behaviour rather than one large vague skill.
• Writes three example prompts per skill: Minimal, Recreate the demo, and Remix.
• Requires browser checks and validation before claiming a demo works.

Install the article-prompts-to-skills skill

Download the ZIP for this skill from the page, then choose one of two locations. For a personal install, unzip it into ~/.claude/skills/. For a single project, unzip it into the project's .claude/skills/ folder.

In the Claude apps, you can instead upload the skill under Settings → Capabilities → Skills.

• Personal: unzip into ~/.claude/skills/
• Project only: unzip into .claude/skills/ inside the project
• Claude apps: Settings → Capabilities → Skills, then upload

Trigger the skill with a natural request

The skill's description lists its trigger situations, so you do not need to type a special command. Ask for the conversion in plain terms. Naming the skill with $article-prompts-to-skills in your prompt, as the included example prompts do, makes the request explicit.

It is meant for requests to turn an article's prompts, tutorial sections, design patterns, interactions or workflow ideas into complete skills rather than prose.

• Use $article-prompts-to-skills to turn the prompts in this tutorial into skills.
• Turn the three interactions in this article into reusable agent skills with demos.
• Convert the tutorial sections in demo/input.md into focused skill packages.

What the skill needs before it runs

The skill is heavy and assumes a specific setup. Several steps depend on tools that are referenced but not included in the files. Check these before you start, otherwise the workflow will stall partway through.

• git, with a repository that has its own instructions
• The skill-creator initializer and its quick_validate.py script
• A permitted browser for demo and screenshot checks
• Repository demo validation tooling, which is referenced but not included in these files

Safety notes: scripts and network access

This skill runs scripts, so review what the agent executes in your environment before approving it. It does not use the network, according to the skill's assessment.

The skill also asks the agent to scan changed files for secrets, tokens, private paths and private client data before committing. Review the source rights yourself: the skill strips brand and layout, but it does not replace a check that you are allowed to reuse the material.

• Runs scripts: yes. Read them before approving.
• Uses network: no.
• Commits only the task's files and leaves unrelated dirty files alone.
• Human review of source rights is still required.

Tips for good results

Give the agent a source that contains explicit prompts, headings and acceptance criteria. The skill is built around traceable evidence, so it will not infer a family of skills from a title alone.

Expect the agent to report a source-to-skill mapping, demo paths, validation and browser evidence, and the commit hash. Check that claimed interaction checks were actually exercised.

• Use a source with explicit prompts rather than a vague topic.
• Review the extraction table before the agent writes files.
• Ask for a narrow commit so unrelated work stays out of it.
• Do not accept a screenshot as proof: the HTML demo has to work.