📰
FrontendHTML

Blog Post

by nexu-io

Blog Post is a Frontend skill for Claude Code, published by nexu-io in html-anything.

8.3K stars810 forkson nexu-io/html-anythingAdded 2026/08/15+1% in starsRepository updated 2026/08/11
agent-skillsagenticai-agentsai-designai-editorbyokclaudeclaude-codeclaude-skillscoding-agentsgenerative-aihtmlhtml-editorhyperframeslocal-firstmarkdownnextjsvibe-codingwechatxiaohongshu
Install in seconds
Install Blog Post
Copy Blog Post into your Claude Code skills folder. Run the command in your terminal, or review the source on GitHub before installing.
terminal
npx degit https://github.com/nexu-io/html-anything/tree/main/next/src/lib/templates/skills/blog-post ~/.claude/skills/blog-post

Requires Node.js. Downloads this skill only — not the rest of the repository — into your Claude Code skills folder.

Without Node.js

git clone https://github.com/nexu-io/html-anything.git

Clones the whole repository, then copy the skill’s own directory into your skills folder yourself.

In this catalog

Source file
next/src/lib/templates/skills/blog-post/SKILL.md in nexu-io/html-anything
Installs to
~/.claude/skills/blog-post
Collection
One of 25 skills cataloged from this repository
Category
Frontend567 skills

What Blog Post does

Blog Post provides a magazine-style long-form article template with masthead, hero, figures, pull quotes, and author byline. Use it when you need a polished editorial layout for articles over 600 words.

Blog Post is cataloged under Frontend on DirSkills. Blog Post comes from a repository tagged agent-skills, agentic, ai-agents, ai-design and ai-editor.

Documentation

README

【模板: 博客长文 / Blog Post】 【意图】≥ 600 字的真正的长文章, 排版以 typography 为主, 70% 文字 20% 图 10% chrome。 【布局】

  • Masthead (publication name + date)
  • Hero (大标题 + 副标 + 作者署名 + 阅读时间)
  • 正文 (单栏 65ch, 含 figures, pull quotes, 行内引用)
  • Author bio 卡片
  • Related posts (3 张卡) 【设计细节】
  • Pull quote 用大号 serif 斜体 + 左侧色条
  • Figures 自带 caption (italic, smaller)
  • 代码块: 圆角 + 深色 + 语言标签

Frequently asked about Blog Post

  • What else does nexu-io publish alongside Blog Post?

    Blog Post is one of 25 skills that DirSkills catalogs from nexu-io/html-anything, the repository it ships in. Its siblings there include Article Magazine, Competitive Teardown and Course Module Deck. Each one is a separate skill with its own page in this directory, installs the same way Blog Post does, and is maintained by nexu-io in that same repository. The rest of the collection is listed on the nexu-io/html-anything page.

  • How does Blog Post compare to other Frontend skills?

    Blog Post ranks #94 by stars among the 567 Frontend skills in this catalog. The most-starred ones next to it are Angular Developer, Android Clean Architecture and Accessibility. DirSkills ranks by the star count of the repository each skill ships in, so that order reflects how popular those repositories are rather than any review of Blog Post against them. Open each page to compare what they document and how they install.

More from nexu-io/html-anything

Blog Post is one of 25 skills cataloged on DirSkills from nexu-io/html-anything.

See all 25 skills
📰
2w ago

Article Magazine

Article Magazine provides a magazine-style HTML template for long-form articles, suited for publishing on blogs, WeChat, and newsletters. It includes hero sections, serif headings, styled quotes, code blocks, and custom bullets.
Frontend
8.3K810
📊
2w ago

Competitive Teardown

Competitive Teardown turns competitor research into a product decision report with a positioning map, feature matrix, pricing comparison, and opportunity windows. Use it when you have materials on 2-6 competitors and need actionable product strategy, not a generic article.
Data
8.3K810
🎓
2w ago

Course Module Deck

Course Module Deck generates an HTML course or training deck with a warm paper background, Playfair serif typography, persistent learning objectives on the left, concept pages, MCQ self-test pages, and a wrap-up with next module preview.
Frontend
8.3K810
📊
2w ago

Dashboard

Dashboard builds a standard admin/analytics single-page layout with a fixed left sidebar, top bar, KPI card grid, one or two main charts, and a recent activity list.
Frontend
8.3K810
📊
2w ago

Data Report

Data Report converts CSV, Excel, or JSON data into a polished visual report page with KPI cards, charts, tables, and insights. Use it when you need to turn raw data into a shareable HTML report.
Data
8.3K810
📊
2w ago

Dating Web

Dating Web is a consumer-feel matching dashboard template with an editorial layout: left rail navigation, ticker bar, headline KPIs, a 30-day mutual-matches bar chart, and a match-rate trend block.
Frontend
8.3K810