Skip to content
MeloSkill

Guide

SKILL.md format

The file name is exactly SKILL.md, inside a named directory. Agents match on the YAML description; they load the markdown body only when that task is on.

This is the Agent Skills layout. MeloSkill only indexes files that have this shape and a usable name plus description. The official spec lives at agentskills.io; what follows is the subset you need to read or write a frontend skill.

Directory

A skill is a folder, not a lone markdown file at the repo root:

frontend-design/
  SKILL.md          # required
  references/       # optional, loaded on demand
  scripts/          # optional; we do not execute these
  assets/           # optional templates, images

The folder name should match the YAML name (lowercase, hyphens). Putting SKILL.md next to README at the repo root is valid for a single-skill repo, but catalogs should nest one folder per skill.

Frontmatter

Required fields:

  • name — max 64 characters, lowercase letters, numbers, hyphens. Must match the directory.
  • description — max 1024 characters. Say what it does and when to use it. This string is what the agent uses to pick the skill, so vague copy means the skill never fires — or it steals every UI prompt from its neighbours.

Common optional fields:

  • license — a license identifier (for example MIT or Apache-2.0) or a path to a license file.
  • compatibility — environment notes (which agent, network, packages).
  • metadata — author, version, anything else as a string map.
---
name: frontend-design
description: Use when asked to design or implement UI that should not look generic. Covers type, color, motion, and layout choices for web interfaces.
license: Apache-2.0
---

# Frontend design

1. Identify the subject matter before picking a palette.
2. Commit to a type scale; do not default to Inter on a cream page.
3. ...

Body vs references

Agents typically keep all descriptions in context, then load the body of one skill. Keep the body as a playbook (steps, constraints, anti-patterns). Put long API dumps in references/ and point to them from the body. A 2,000-line SKILL.md is usually a documentation dump, not a skill.

MeloSkill skips files over 200KB when it snapshots GitHub. If you are writing a skill, stay well under that; if you are installing one, a huge file is a reason to read before you trust it.

Description quality

Weak: Helps with UI. That matches every interface task and none specifically.

Stronger: Use when building or reviewing React Three Fiber scenes. Not for vanilla Three.js. Triggers and exclusions belong in the description, not only in the body — the body may never load.

What this site stores

We snapshot the markdown body, rewrite relative images to GitHub raw URLs, and show the file on the skill page — including the description field at the top of that file. We are not the author. License and path stay on the listing; original comparison sentences on task pages and under the title on a skill listing are ours.

Also