Skill1.4k estrellas del repoactualizado today

html-plan

The html-plan skill generates a self-contained HTML document that organizes user-provided planning content into a clean, pragmatic layout with built-in dark mode support. Use this when you need a visually organized plan page that preserves your original wording while improving grammar and readability, without expanding or restructuring your input into something more elaborate.

Ver fuente Repositorio: effective-html

Instalar en Claude Code

Copiar

git clone --depth 1 https://github.com/plannotator/effective-html /tmp/html-plan && cp -r /tmp/html-plan/skills/html-plan ~/.claude/skills/html-plan

Después abre una sesión nueva de Claude Code; el skill carga automáticamente.

Definición

SKILL.md

# HTML Plan

Review the files throughout `references/html-effectiveness/`.

After reviewing them, create an HTML file for the plan in a similar style.

Keep it pragmatic and simple.

Always include dark mode: hand-rolled CSS variables on `:root` / `html.dark`, a small theme toggle button, `localStorage` persistence, and an apply-before-paint script in `<head>` (default to `prefers-color-scheme`).

Del mismo repositorio

html-diagramSkill

Create a self-contained HTML file for visualizing architecture and understanding the stack with a high-quality SVG diagram. Use when the user wants a full-screen diagram, wants the output to be light on prose, or wants an HTML artifact that is mostly there to make the architecture click fast.

htmlSkill

Create a self-contained HTML file for whatever the user is describing, in the effective HTML style. Use when the user wants an HTML artifact that isn't specifically a diagram or a plan — a report, explainer, comparison, deck, prototype, or anything else best delivered as one HTML file.