alphilippo

Regenerate HTML — Design skill for Claude Code

Design community

Rebuild index.html from TIPS.md, preserving the design.

How to install Regenerate HTML

Installs to ~/.claude/commands/alphilippo-boris-cherny-claude-code-playbook-regenerate-html.md

Terminal
mkdir -p ~/.claude/commands && curl -fsSL https://raw.githubusercontent.com/alphilippo/boris-cherny-claude-code-playbook/HEAD/.claude/commands/regenerate-html.md -o ~/.claude/commands/alphilippo-boris-cherny-claude-code-playbook-regenerate-html.md

Restart Claude Code, or start a new session, for it to be picked up.

What Regenerate HTML does


description: Rebuild index.html from TIPS.md, preserving the design

/regenerate-html — Rebuild Dashboard

Synchronizes `index.html` with `TIPS.md`. Use this after `TIPS.md` has been changed by `/add-tip`, `/scan-x`, or the routine.

Workflow

Step 1 — Parse TIPS.md

Read TIPS.md. Extract:

  • All 21 theme sections (## NN — Theme Name)
  • All tips per theme: ID, title, difficulty, date, source URL, author, quote (optional), description

Step 2 — Open index.html in Repo

Read th

Alternatives in Design

  • Export Diagram — Export a diagram-design HTML file to .svg and .png next to the source 27.2k ★
  • Huashu Design — Huashu Design · HTML-native design skill for Claude Code · Claude Code 里 HTML 原生的设计 skill · 高保真原型 / 幻灯片 / 动画 + 23.6k ★
  • Grade — Generate a shareable HTML "Design Report Card" — letter grade, 8 dimensions, evidence (palette, type, rhythm) 3.6k ★

Full documentation available on GitHub

View Source Repository