Mmcp.market

blog-post skill

by nexu-io·nexu-io/open-design·98k stars·Apache-2.0

A long-form article / blog post — masthead, hero image placeholder, article body with figures and pull quotes, author byline, related posts. Use when the brief asks for "blog", "article", "post", "essay", or "case study".

A100/100content scan

Is the blog-post skill safe?

Clean: nothing in its files matched our rules. We read 3 files in the folder on 2026-09-28.

No findings.

Install the blog-post skill

A skill is a folder. Copy it into your agent's skills folder and the agent loads it when the task matches its description. 

git clone --depth 1 https://github.com/nexu-io/open-design.git /tmp/open-design
mkdir -p ~/.claude/skills
cp -r /tmp/open-design/plugins/_official/examples/blog-post ~/.claude/skills/blog-post
available in every project

In the Claude apps, zip the folder and upload it from the Skills settings. The folder on GitHub

The instructions your agent would load

SKILL.md as published, without the frontmatter. Read it on GitHub

Blog Post Skill

Produce a single long-form article page — editorial layout, no chrome.

Workflow

tokens — long-form is 70% type, 20% image, 10% chrome.

  1. Read the active DESIGN.md (injected above). Lean into the typography

words across 4–6 H2 sections. No lorem ipsum.

  1. Pick the topic from the brief and write a real article — at least 600
  1. Sections, in order:

deck (1–2 sentence subhead), author name + role + date.

  • Masthead — small wordmark + 4–6 nav links, plain.
  • Article header — category eyebrow, headline (display token, large),

solid fill (no external images). Add a 1-line caption underneath.

  • Hero image — a 16:9 placeholder block using a DS-tinted gradient or

block, title, 1-line excerpt, date.

  • Body — alternating prose paragraphs with at least:
  • 1 pull quote (large display type, accent rule on the inline-start edge so the layout flips correctly under dir="rtl").
  • 1 figure (image placeholder + caption).
  • 1 list (numbered or bulleted).
  • 1 inline blockquote.
  • Author footer — author avatar (initials in a circle), bio paragraph.
  • Related — 3 cards linking to other posts. Each card: tiny image
  1. Write a single HTML document:

rule (typically 680–720px).

  • <!doctype html> through , CSS inline.
  • Article body uses the DS body font, centered, max-width per DS layout

skip on tech-y DSes.

  • Drop caps (first-letter) only if the DS mood is editorial / serif —
  • data-od-id on the headline, hero, body, pull quote, related grid.
  1. Self-check:

section dividers; pull quotes do not compete with H1.

  • Type hierarchy is unambiguous — H1 is clearly the headline; H2s are
  • Line length 60–75 chars for body prose.
  • Accent appears at most twice (eyebrow + pull-quote rule, or one link).
  • The page reads like a magazine, not a marketing landing.

Output contract

Emit between tags:

<artifact identifier="post-slug" type="text/html" title="Article Title">
<!doctype html>
<html>...</html>
</artifact>

One sentence before the artifact, nothing after.

More skills from nexu-io/open-design

  • Aarticle-magazineHuashu / huashu-md-html-inspired magazine article layout for turning Markdown or notes into a polished long-form HTML essay.
  • Aaudio-jingleAudio generation skill — jingles, beds, voiceover, and sound effects. Routes music requests to Suno V5 / Udio / Lyria, speech to MiniMax TTS / FishAudio / ElevenLabs V3, and SFX to ElevenLabs SFX or AudioCraft. Output is one MP3/WAV file saved to the project folder.
  • Aaudio-jingleAudio generation skill — jingles, beds, voiceover, and sound effects. Routes music requests to Suno V5 / Udio / Lyria, speech to MiniMax TTS / FishAudio / ElevenLabs V3, and SFX to ElevenLabs SFX or AudioCraft. Output is one MP3/WAV file saved to the project folder.
  • Ablog-postA long-form article / blog post — masthead, hero image placeholder, article body with figures and pull quotes, author byline, related posts. Use when the brief asks for "blog", "article", "post", "essay", or "case study".
  • Abuild-testRun the project's build / typecheck / lint / test commands and emit the build.passing + tests.passing signals devloop convergence reads.
  • Acard-twitterTwitter quote or data card designed to pair with a post.
  • Acard-xiaohongshuXiaohongshu-style knowledge cards, arranged as a swipeable multi-card carousel.
  • Aclinical-case-reportStructured medical case presentation for clinical rounds, conferences, and documentation. Generates SOAP-format or narrative case reports with physiologically accurate vitals, labs, and evidence-based plans. Use when the brief mentions "case report", "case presentation", "SOAP note", "clinical case", "ward rounds", "case summary", or "patient presentation".
  • Aclinical-case-reportStructured medical case presentation for clinical rounds, conferences, and documentation. Generates SOAP-format or narrative case reports with physiologically accurate vitals, labs, and evidence-based plans. Use when the brief mentions "case report", "case presentation", "SOAP note", "clinical case", "ward rounds", "case summary", or "patient presentation".
  • Acode-importRead an existing repository's structure into the project cwd as a normalised snapshot the agent can analyse without re-walking the tree on every turn.
  • Acodex-interactive-capability-mapTurn a long-form article, thread, memo, or product narrative into a compact clickable capability map with a workflow loop, use-case matrix, and responsive detail panel.
  • Acontact-widgetSelf-contained floating chat widget with welcome screen, social links, meeting button, and message input. Single HTML file, zero dependencies.

All agent skills → · MCP servers