Skip to content
cccskills
FreePublished on GitHubEnglish overview

article-magazine

Turn Markdown or notes into a magazine-style HTML article. A large title, centered reading column, distinctive headings, styled quotations, and labeled code blocks give long essays and newsletters a consistent visual structure.

OriginalShow the original description

Huashu / huashu-md-html-inspired magazine article layout for turning Markdown or notes into a polished long-form HTML essay.

AI rating100/ 100See how to install

Good for

  • Turning Markdown into a magazine-style article
  • Formatting an essay from notes
  • Designing a long-form newsletter
  • Presenting articles with quotations and code

Overview

What it does

article-magazine turns Markdown or notes into a magazine-style, long-form HTML article. It places a large title at the top, with an optional subtitle, author, reading time, and date. The body sits in a centered column with a maximum width of about 700px. Serif headings provide a visual distinction from the body text. The layout takes inspiration from Huashu / huashu-md-html.

When it helps

Use it when you want to publish a substantial blog post, essay, or newsletter in a readable format. Quotations appear in italics beside a thick, colored left border. Code blocks use a dark background and show a language label. These styles distinguish different kinds of content within articles that include quotations or code.

Example requests

  • “Turn this Markdown into a magazine-style HTML article with a large title and a comfortable reading width.”
  • “Shape these notes into an article and make the quotations and code blocks visually consistent.”

Decorative dividers separate sections, and a simple card at the end encourages sharing. The article is intended to use real content and data.

Notes

There are no special notes.

This overview was written by AI (OpenAI Codex) from the public SKILL.md. Check the original below for the exact behavior.

Objective evaluation

AI rated this skill on four points using only the contents of its SKILL.md. Stars and popularity are not taken into account.

Clear instructionsIs it clear when to use it and what it does?
AGoodIt explicitly describes converting Markdown or notes into long-form HTML articles and defines the layout.
Concrete stepsAre steps, inputs, outputs, and examples spelled out?
AGoodIt specifies an approximately 700px body width and styles for headings, quotations, code, dividers, and an ending card.
SafetyAre sending data, deleting files, and running commands disclosed?
AGoodThe material defines HTML presentation and contains no instructions for external transmission, deletion, or credential access.
Easy setupDoes it need few tools or API keys, and are they documented?
AGoodA design system is explicitly unnecessary, and no additional tools or API keys are specified.

The total counts each point as A = 25, B = 15, C = 5. Rated by AI (OpenAI Codex) as of Oct 20, 2026. Treat it as a guide and read the original before installing.

Disagree? Request a re-evaluation

Tell us which point is wrong and why. No login needed. We will check it against the SKILL.md, redo the evaluation, and show the result here.

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

Files included (3)

  • SKILL.md2.5 KB
  • example.html7.0 KB
  • example.md2.0 KB

SKILL.md (original)

Review the instructions the agent will receive before you install.

【模板: 杂志文章】

  • 顶部 hero: 大标题 (text-5xl/6xl) + 可选副标题 + 作者 / 阅读时间 / 日期元数据。
  • 正文: 单栏, 最大宽度约 700px, 居中。段落 text-lg leading-relaxed text-neutral-700 dark:text-neutral-300。
  • H2 / H3 标题用 serif 字体, 让正文与标题有视觉对比。
  • 引用块使用左侧粗 accent 色边线 + 斜体。
  • 代码块: 圆角 + 深色背景 + 浅色文字, 显示语言标签。
  • 列表项使用自定义 bullet(小方块 / accent 圆点)。
  • 章节之间用 <hr> 分隔, 但样式做成中央居中的小 ornament。
  • 文末加一个简单的 "如果觉得有用,欢迎转发" 行动卡片。

Reviews

No reviews yet. Tell others what you thought.

Comments

No login needed. Share how it worked for you, ask a question, or note where it did not run.

No comments yet. Be the first to write one.

Comments are published right away. Do not include personal information such as email addresses or phone numbers. Up to 2 URLs.

0 / 1,000 characters

This form is protected by reCAPTCHA, and the Google Privacy Policy and Terms of Service apply.

More skills from this repository

8-bit-orbit-video-template

FreeSummaryAI rating 90

Create a three-scene video composition in a retro pixel style using a Hyperframes HTML template. Customize titles, labels, and colors while preserving scene transitions, short scene durations, and repeatable animation timing.

  • Create a retro pixel presentation video
  • Customize a three-scene video template
  • Preview scene transitions and motion in HTML
nexu-io/open-design103.1KUpdated Oct 22, 2026

ad-creative

FreeSummaryAI rating 80

Create and revise headlines, descriptions, and main text for paid social and search ads. Use it to develop ad copy options and refine wording through repeated rounds of revision.

  • Drafting headlines for paid social ads
  • Creating descriptions for search ads
  • Revising the main text of an ad
nexu-io/open-design103.1KUpdated Oct 22, 2026

after-hours-editorial-template

FreeSummaryAI rating 80

Create a three-page editorial motion sequence with dark backgrounds, serif typography, staged text reveals, and chapter transitions. The result is a single HTML file suited to fashion-inspired storytelling and short visual presentations.

  • Creating a fashion-inspired motion presentation
  • Presenting a short story across three pages
  • Applying existing brand rules to a dark editorial sequence
nexu-io/open-design103.1KUpdated Oct 22, 2026

agent-browser

FreeSummaryAI rating 100

Inspect and test web pages through a browser automation command-line tool. Navigate, click, enter text, capture screenshots, and extract page details, with a focus on checking local OpenDesign previews and reviewing web app quality.

  • Checking local OpenDesign previews
  • Testing clicks and text entry in web apps
  • Capturing page or element screenshots
nexu-io/open-design103.1KUpdated Oct 22, 2026

ai-music-album

FreeSummaryAI rating 80

Plan an AI music album from its concept through lyric drafts, track order, and export. Intended for independent album experiments and brand soundtracks, with the full production workflow provided through a separately installed upstream bundle.

  • Planning an experimental independent album
  • Drafting lyrics around an album concept
  • Deciding the running order of tracks
nexu-io/open-design103.1KUpdated Oct 22, 2026

algorithmic-art

FreeSummaryAI rating 80

Create generative art, or images made with programmed rules, using p5.js. Fixed random seeds make each rendering reproducible, supporting procedural posters, still images that suggest motion, and studies of artistic frame composition.

  • Posters generated with programmed rules
  • Still images that suggest motion
  • Studies of artistic frame composition
nexu-io/open-design103.1KUpdated Oct 22, 2026

See all skills by nexu-io

Report a problem with this skill