How to use the Magazine Article Layout agent skill (article-magazine)

What the article-magazine skill makes the agent do

An agent skill is a folder of instructions that an AI agent can load when a task matches it. This one is described in a file called SKILL.md, and it tells the agent how to lay out long-form content. The output is a single-column web page, centred with a maximum width of about 700px, with a large headline and an optional subtitle and author, reading time and date line.

The layout follows a visual template inspired by the Huashu / huashu-md-html style, a Chinese-language HTML layout style. Body text uses large, relaxed type. Section headings use a serif font so they contrast with the body. Quotes get a thick accent-coloured left border and italic text. Code blocks have rounded corners, a dark background, light text and a language label. List bullets are custom squares or accent dots. Sections are separated by centred ornaments, and the page ends with a simple "If you found this useful, feel free to share" card.

The package includes an example page (example.html) so you can see the finished look before you use it.

Install the article-magazine skill

Download the ZIP for this skill from the page you are reading. Then choose one of two routes.

For a personal install that works across your projects, unzip the download into ~/.claude/skills/. For a single project, unzip it into that project's .claude/skills/ folder instead.

If you use the Claude apps, you can upload the skill instead. Open Settings, go to Capabilities, then Skills, and upload the ZIP there.

• Personal: ~/.claude/skills/
• Project only: .claude/skills/ inside your project
• Claude apps: Settings → Capabilities → Skills

Trigger the skill with a natural request

You don't need a special command. Once the skill is installed, describe what you want in plain language and mention the article or essay layout. The skill's description covers turning Markdown or notes into a long-form HTML essay, so requests that match that task are the ones most likely to load it.

The source's example prompt is a good model. It asks for the Magazine Article template, real content and data, and no lorem ipsum or placeholder images. Adapt it to your own material.

• "Turn my notes in notes.md into a magazine-style long-form HTML essay."
• "Lay out this Markdown draft as a polished article with a large headline and styled quotes."
• "Use the Magazine Article layout to make my newsletter draft into an HTML page, with real content and no placeholder images."

Get a good result from your input

The skill styles what you give it, so the input matters. Clear headings and paragraphs give the agent a structure to follow. Real quotes, code snippets and links will appear in the layout where they belong, because the template includes styled blocks for them.

The example in the source is an essay built from a Markdown post with a linked source note, so it shows how links and attribution can sit inside the article.

• Use Markdown headings (#, ##) to mark sections.
• Put quotes in blockquotes so they get the styled quote treatment.
• Put code in fenced blocks so it gets the dark code style and language label.
• Include a title and, if you have one, a subtitle and author name for the hero area.

Safety, requirements and what the skill does not do

According to the skill's metadata, it requires nothing beyond the agent itself, does not run scripts, and does not use the network. The package contains three files: SKILL.md, an example page and open-design.json. Because it runs no scripts and makes no network calls, the risk is mainly in the instructions and the content you feed it.

The template defines its own look. It does not require a design system, so it is not the right choice if your project must follow a specific brand design system. It also produces styled HTML, so it is not suited to a CMS that strips HTML or CSS and needs plain output.

• Runs scripts: no
• Uses network: no
• Requires: nothing listed
• Files: SKILL.md, example.html, open-design.json