skills.rest
nexu-io
nexu-ioOFFICIAL
Explore all skills by this author →
WebsiteGitHub

blog-post

Generate magazine-style article HTML pages with inline CSS and data-od attributes.

84.7k|9.9k|Updated Apr 28, 2026
Search Tags:#html#article#editorial#design-system#blog-post#magazine-layout
One-click install
npx skills add https://github.com/nexu-io/open-design --skill blog-post-nexu-io
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: blog-post
Source: https://github.com/nexu-io/open-design/tree/main/skills/blog-post
Command: npx skills add https://github.com/nexu-io/open-design --skill blog-post-nexu-io

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

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".

Core Features & Use Cases

  • Editorial layout for long-form article pages with masthead, hero image placeholder, author byline, and related posts sections.
  • Design-system-driven output: compatible with color, typography, layout, and components.
  • Output a single HTML document with inlined CSS and data-od attributes for the DS.

Quick Start

Write a single HTML document that implements a magazine-style article page using the DS tokens and layout guidelines.

Frequently Asked Questions about blog-post

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I generate a magazine-style article page from a brief?▼

Generate a magazine-style article page by providing an editorial brief to produce a single HTML document with a masthead, hero image placeholder, author byline, and related posts section using inline CSS.

What HTML structure is needed for a long-form blog post with editorial layouts?▼

A long-form blog post requires a single HTML document containing proper headings, figures, pull quotes, inline CSS, and data-od attributes to align with design system guidelines for magazine layouts.

Do I need a design system to create magazine-style article pages?▼

Yes, generating magazine-style article pages requires a design system with defined color, typography, layout, and component tokens to ensure the output HTML adheres to consistent editorial styling guidelines.

Can I use this approach for case study and thought-leadership content?▼

Yes, the magazine-style article generation supports marketing, editorial, thought-leadership, and case study content workflows by outputting structured HTML pages with mastheads and related post sections.

What's the best way to include related posts in an article layout?▼

Include related posts by generating a three-card section within the HTML document, utilizing design system layout tokens to ensure consistent visual alignment with the main article body and masthead.

Related Skills

Explore More Design & Creative Skills→
TedTschoppTedTschopp

brand-guidelines

Enforce tedt.org color, typography, and layout rules across design artifacts.

Community
Basic
pipixia-labspipixia-labs
38

blog-post

Generate a complete long-form article page as a single HTML document with inline CSS.

Official
Advanced
Clos01Clos01
3

blog-post

Generate structured editorial HTML articles from content briefs.

Community
Intermediate
MyHeavenDyfMyHeavenDyf

magazine-poster

Generate editorial magazine-style posters with HTML layout and serif typography.

Community
Advanced