{"id":"d2b6c53f-e069-4ce2-914d-2b67682ff5bf","shortId":"JL3BnZ","kind":"skill","title":"blog-post","tagline":"A long-form article / blog post — masthead, hero image placeholder,\narticle body with figures and pull quotes, author byline, related posts.\nUse when the brief asks for \"blog\", \"article\", \"post\", \"essay\", or\n\"case study\".","description":"# Blog Post Skill\n\nProduce a single long-form article page — editorial layout, no chrome.\n\n## Workflow\n\n1. **Read the active DESIGN.md** (injected above). Lean into the typography\n tokens — long-form is 70% type, 20% image, 10% chrome.\n2. **Pick the topic** from the brief and write a real article — at least 600\n words across 4–6 H2 sections. No lorem ipsum.\n3. **Sections**, in order:\n - **Masthead** — small wordmark + 4–6 nav links, plain.\n - **Article header** — category eyebrow, headline (display token, large),\n deck (1–2 sentence subhead), author name + role + date.\n - **Hero image** — a 16:9 placeholder block using a DS-tinted gradient or\n solid fill (no external images). Add a 1-line caption underneath.\n - **Body** — alternating prose paragraphs with at least:\n - 1 pull quote (large display type, accent rule on the inline-start edge so the layout flips correctly under `dir=\"rtl\"`).\n - 1 figure (image placeholder + caption).\n - 1 list (numbered or bulleted).\n - 1 inline blockquote.\n - **Author footer** — author avatar (initials in a circle), bio paragraph.\n - **Related** — 3 cards linking to other posts. Each card: tiny image\n block, title, 1-line excerpt, date.\n4. **Write** a single HTML document:\n - `` through ``, CSS inline.\n - Article body uses the DS body font, centered, max-width per DS layout\n rule (typically 680–720px).\n - Drop caps (`first-letter`) only if the DS mood is editorial / serif —\n skip on tech-y DSes.\n - `data-od-id` on the headline, hero, body, pull quote, related grid.\n5. **Self-check**:\n - Type hierarchy is unambiguous — H1 is clearly the headline; H2s are\n section dividers; pull quotes do not compete with H1.\n - Line length 60–75 chars for body prose.\n - Accent appears at most twice (eyebrow + pull-quote rule, or one link).\n - The page reads like a magazine, not a marketing landing.\n\n## Output contract\n\nEmit between `` tags:\n\n```\n\n\n...\n\n```\n\nOne sentence before the artifact, nothing after.","tags":["blog","post","open","design","nexu-io","agent-skills","ai-agents","ai-design","byok","claude","claude-code-for-design","claude-design"],"capabilities":["skill","source-nexu-io","skill-blog-post","topic-agent-skills","topic-ai-agents","topic-ai-design","topic-byok","topic-claude","topic-claude-code-for-design","topic-claude-design","topic-coding-agents","topic-design-systems","topic-design-tools","topic-desktop-app","topic-figma-alternative"],"categories":["open-design"],"synonyms":[],"warnings":[],"endpointUrl":"https://skills.sh/nexu-io/open-design/blog-post","protocol":"skill","transport":"skills-sh","auth":{"type":"none","details":{"cli":"npx skills add nexu-io/open-design","source_repo":"https://github.com/nexu-io/open-design","install_from":"skills.sh"}},"qualityScore":"0.700","qualityRationale":"deterministic score 0.70 from registry signals: · indexed on github topic:agent-skills · 36607 github stars · SKILL.md body (2,165 chars)","verified":false,"liveness":"unknown","lastLivenessCheck":null,"agentReviews":{"count":0,"score_avg":null,"cost_usd_avg":null,"success_rate":null,"latency_p50_ms":null,"narrative_summary":null,"summary_updated_at":null},"enrichmentModel":"deterministic:skill-github:v1","enrichmentVersion":1,"enrichedAt":"2026-05-11T06:52:18.759Z","embedding":null,"createdAt":"2026-05-01T18:52:31.669Z","updatedAt":"2026-05-11T06:52:18.759Z","lastSeenAt":"2026-05-11T06:52:18.759Z","tsv":"'1':55,122,151,162,184,189,194,220 '10':75 '16':133 '2':77,123 '20':73 '3':101,208 '4':94,108,224 '5':283 '6':95,109 '60':309 '600':91 '680':249 '70':71 '720px':250 '75':310 '9':134 'accent':168,315 'across':93 'activ':58 'add':149 'altern':156 'appear':316 'articl':8,15,33,48,88,113,233 'artifact':347 'ask':30 'author':22,126,197,199 'avatar':200 'bio':205 'block':136,218 'blockquot':196 'blog':2,9,32,39 'blog-post':1 'bodi':16,155,234,238,278,313 'brief':29,83 'bullet':193 'bylin':23 'cap':252 'caption':153,188 'card':209,215 'case':37 'categori':115 'center':240 'char':311 'check':286 'chrome':53,76 'circl':204 'clear':293 'compet':304 'contract':339 'correct':180 'css':231 'data':271 'data-od-id':270 'date':129,223 'deck':121 'design.md':59 'dir':182 'display':118,166 'divid':299 'document':229 'drop':251 'ds':140,237,245,259 'ds-tint':139 'dses':269 'edg':175 'editori':50,262 'emit':340 'essay':35 'excerpt':222 'extern':147 'eyebrow':116,320 'figur':18,185 'fill':145 'first':254 'first-lett':253 'flip':179 'font':239 'footer':198 'form':7,47,69 'gradient':142 'grid':282 'h1':291,306 'h2':96 'h2s':296 'header':114 'headlin':117,276,295 'hero':12,130,277 'hierarchi':288 'html':228 'id':273 'imag':13,74,131,148,186,217 'initi':201 'inject':60 'inlin':173,195,232 'inline-start':172 'ipsum':100 'land':337 'larg':120,165 'layout':51,178,246 'lean':62 'least':90,161 'length':308 'letter':255 'like':331 'line':152,221,307 'link':111,210,327 'list':190 'long':6,46,68 'long-form':5,45,67 'lorem':99 'magazin':333 'market':336 'masthead':11,105 'max':242 'max-width':241 'mood':260 'name':127 'nav':110 'noth':348 'number':191 'od':272 'one':326,343 'order':104 'output':338 'page':49,329 'paragraph':158,206 'per':244 'pick':78 'placehold':14,135,187 'plain':112 'post':3,10,25,34,40,213 'produc':42 'prose':157,314 'pull':20,163,279,300,322 'pull-quot':321 'quot':21,164,280,301,323 'read':56,330 'real':87 'relat':24,207,281 'role':128 'rtl':183 'rule':169,247,324 'section':97,102,298 'self':285 'self-check':284 'sentenc':124,344 'serif':263 'singl':44,227 'skill':41 'skill-blog-post' 'skip':264 'small':106 'solid':144 'source-nexu-io' 'start':174 'studi':38 'subhead':125 'tag':342 'tech':267 'tech-i':266 'tini':216 'tint':141 'titl':219 'token':66,119 'topic':80 'topic-agent-skills' 'topic-ai-agents' 'topic-ai-design' 'topic-byok' 'topic-claude' 'topic-claude-code-for-design' 'topic-claude-design' 'topic-coding-agents' 'topic-design-systems' 'topic-design-tools' 'topic-desktop-app' 'topic-figma-alternative' 'twice':319 'type':72,167,287 'typic':248 'typographi':65 'unambigu':290 'underneath':154 'use':26,137,235 'width':243 'word':92 'wordmark':107 'workflow':54 'write':85,225 'y':268","prices":[{"id":"a9db585c-e219-4d28-87b8-1844ae5d4539","listingId":"d2b6c53f-e069-4ce2-914d-2b67682ff5bf","amountUsd":"0","unit":"free","nativeCurrency":null,"nativeAmount":null,"chain":null,"payTo":null,"paymentMethod":"skill-free","isPrimary":true,"details":{"org":"nexu-io","category":"open-design","install_from":"skills.sh"},"createdAt":"2026-05-01T18:52:31.669Z"}],"sources":[{"listingId":"d2b6c53f-e069-4ce2-914d-2b67682ff5bf","source":"github","sourceId":"nexu-io/open-design/blog-post","sourceUrl":"https://github.com/nexu-io/open-design/tree/main/skills/blog-post","isPrimary":false,"firstSeenAt":"2026-05-01T18:52:31.669Z","lastSeenAt":"2026-05-11T06:52:18.759Z"},{"listingId":"d2b6c53f-e069-4ce2-914d-2b67682ff5bf","source":"skills_sh","sourceId":"nexu-io/open-design/blog-post","sourceUrl":"https://skills.sh/nexu-io/open-design/blog-post","isPrimary":true,"firstSeenAt":"2026-05-07T20:42:46.808Z","lastSeenAt":"2026-05-07T22:41:47.773Z"}],"details":{"listingId":"d2b6c53f-e069-4ce2-914d-2b67682ff5bf","quickStartSnippet":null,"exampleRequest":null,"exampleResponse":null,"schema":null,"openapiUrl":null,"agentsTxtUrl":null,"citations":[],"useCases":[],"bestFor":[],"notFor":[],"kindDetails":{"org":"nexu-io","slug":"blog-post","github":{"repo":"nexu-io/open-design","stars":36607,"topics":["agent-skills","ai-agents","ai-design","byok","claude","claude-code-for-design","claude-design","coding-agents","design-systems","design-tools","desktop-app","figma-alternative","generative-ai","hermes-agent","local-first","nextjs","no-code","prototyping","ui-generator","vibe-coding"],"license":"apache-2.0","html_url":"https://github.com/nexu-io/open-design","pushed_at":"2026-05-11T06:48:43Z","description":"🎨 Local-first, open-source alternative to Anthropic's Claude Design. ⚡ 19 Skills · ✨ 71 brand-grade Design Systems 🖼 Generate web · desktop · mobile prototypes · slides · images · videos · HyperFrames 📦 Sandboxed preview · HTML/PDF/PPTX/MP4 export 🤖 Runs on Claude Code / Codex / Cursor / Gemini / OpenCode / Qwen / Copilot / Hermes / Kimi CLI.","skill_md_sha":"3c91c3359e0c801b20db40ca290a175888caff21","skill_md_path":"skills/blog-post/SKILL.md","default_branch":"main","skill_tree_url":"https://github.com/nexu-io/open-design/tree/main/skills/blog-post"},"layout":"multi","source":"github","category":"open-design","frontmatter":{"name":"blog-post","description":"A long-form article / blog post — masthead, hero image placeholder,\narticle body with figures and pull quotes, author byline, related posts.\nUse when the brief asks for \"blog\", \"article\", \"post\", \"essay\", or\n\"case study\"."},"skills_sh_url":"https://skills.sh/nexu-io/open-design/blog-post"},"updatedAt":"2026-05-11T06:52:18.759Z"}}