article-icons

Embed semantically matched inline SVG icons into Markdown, HTML, and MDX articles.

207|30|Updated May 16, 2026
One-click install
npx skills add https://github.com/smallnest/goal-workflow --skill article-icons
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: article-icons
Source: https://github.com/smallnest/goal-workflow/tree/main/skills/article-icons
Command: npx skills add https://github.com/smallnest/goal-workflow --skill article-icons

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes scripts (resource) components.

What problem does it solve?

It helps authors and AI assistants add tasteful, semantically matched icons to articles and docs without building a React app or hand-drawing artwork.

Core Features & Use Cases

  • Article illustration: Add icons to section headings, key concepts, lists, and callouts so long-form content is easier to scan.
  • Static SVG output: Fetch itshover icons and convert them into clean inline SVG that works in Markdown or HTML.
  • Practical workflow: Ideal for enhancing blog posts, knowledge-base pages, release notes, and technical docs with a consistent visual style.

Quick Start

Use the article-icons skill to review the article, propose a heading-to-icon mapping, and then embed matching inline SVG icons into the target document.

Frequently Asked Questions about article-icons

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

FAQPage Schema
How do I add inline SVG icons to Markdown documentation?

You can add inline SVG icons to Markdown by proposing a heading-to-icon mapping, fetching static SVGs from the itshover registry, and embedding render-safe markup directly into your document.

Can I use inline icons in HTML and MDX articles without a React app?

Yes, you can use inline icons in HTML and MDX articles without a React app by fetching static SVG output from the itshover registry and embedding it as render-safe markup directly into your static content.

What is the best way to illustrate key concepts and callouts in technical docs?

The best way to illustrate key concepts and callouts in technical docs is applying semantically matched inline SVG icons to headings and lists, converting itshover icons into clean static SVG that works in Markdown or HTML.

Does the article-icons workflow support static HTML output for blog posts?

Yes, the article-icons workflow supports static HTML output for blog posts by fetching itshover icons and converting them into clean inline SVG that works natively in Markdown, HTML, and MDX content.

Why use inline SVG instead of image files for article illustrations?

Using inline SVG instead of image files for article illustrations ensures render-safe markup that works natively in Markdown or HTML, providing a consistent visual style for long-form content without external asset dependencies.