design-html
Implement designs as production-ready HTML/CSS with pixel-level fidelity. Garry Tan's design-html skill — translates mockups, Figma specs, or design descriptions into clean, semantic, accessible HTML output.
How do I install this agent skill?
npx skills add https://github.com/podo/design-agent-skills --skill design-htmlIs this agent skill safe to install?
- Gen Agent Trust Hubpass
This skill is an installation stub that facilitates the setup of the full design-html implementation from a public GitHub repository. It includes standard environment checks and uses a package manager for installation. No security risks or malicious behaviors were identified.
- Socketpass
No alerts
- Snykwarn
Risk: MEDIUM · 1 issue
What does this agent skill do?
design-html
Catalogue stub — full skill: garrytan/gstack
Decision tree
-
Is the full skill already installed? Check whether the skill at this location still has a
das:block:- Global:
grep -q "^das:" ~/.agents/skills/design-html/SKILL.md 2>/dev/null && echo "pointer" || echo "installed" - Project:
grep -q "^das:" .agents/skills/design-html/SKILL.md 2>/dev/null && echo "pointer" || echo "installed" - No
das:block → full skill installed, invoke it and proceed das:block present → go to step 2
- Global:
-
Detect scope, then install:
To detect scope:
[ -e ~/.agents/skills/design-html ] && echo "global" || echo "project"Global (installed with
-g):npx skills add garrytan/gstack --skill design-html -g -yProject (installed without
-g):npx skills add garrytan/gstack --skill design-html -yClaude Code: send either command as a chat message starting with
!to run it without leaving the conversation.
Invoke after install
- Skill name:
design-html - Trigger phrases: "design html", "design to HTML", "implement design", "mockup to code"
What it does
Translates design specs, mockups, or Figma descriptions into production-ready HTML/CSS with pixel-level fidelity. Part of Garry Tan's gstack — focused on faithful implementation that preserves typographic choices, spacing relationships, and visual hierarchy from the design source.
How can the creator link this skill?
Add the canonical catalog link to the repository README so users can inspect current installs and available audits. The publishing guide covers the complete discovery path.
<a href="https://skillzs.dev/skills/podo/design-agent-skills/design-html">View design-html on skillZs</a>