design-html

Convert approved mockups or planning inputs into production-ready HTML/CSS.

Updated Mar 28, 2026
One-click install
npx skills add https://github.com/steadyfall/fspeek --skill design-html-steadyfall
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-html
Source: https://github.com/steadyfall/fspeek/tree/main/.claude/skills/gstack/design-html
Command: npx skills add https://github.com/steadyfall/fspeek --skill design-html-steadyfall

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Design finalization: generates production-quality Pretext-native HTML/CSS. Works with approved mockups from /design-shotgun, CEO plans from /plan-ceo-review, design review context from /plan-design-review, or from scratch with a user description. Text actually reflows, heights are computed, layouts are dynamic. 30KB overhead, zero deps. Smart API routing: picks the right Pretext patterns for each design type. Use when: "finalize this design", "turn this into HTML", "build me a page", "implement this design", or after any planning skill. Proactively suggest when user has approved a design or has a plan ready. (gstack) Voice triggers (speech-to-text aliases): "build the design", "code the mockup", "make it real".

Core Features & Use Cases

  • Produces production-ready HTML/CSS from design inputs, ready to deploy
  • Smart routing selects the appropriate Pretext pattern per design type
  • Integrates with mockups, planning documents, or free-text descriptions to deliver HTML/CSS

Quick Start

Use design-html to convert an approved mockup or plan into production HTML/CSS in one step.

Frequently Asked Questions about design-html

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

FAQPage Schema
How do I convert design mockups into production-ready HTML and CSS?

Converting design mockups into production HTML and CSS involves routing approved mockups through smart pattern selection to generate zero-dependency, deployable code with computed layouts, text reflow, and dynamic heights.

What is the best way to generate HTML from a planning document?

The best way to generate HTML from a planning document is using smart routing to select appropriate design patterns, yielding production-ready code with text reflow, computed heights, and zero dependencies.

Can I build a web page from a fresh text description without existing mockups?

You can build a web page from a fresh text description without existing mockups by supplying a free-text description to generate production-quality HTML and CSS with dynamic layouts and small footprint.

Does this HTML generation approach support dynamic text reflow and computed heights?

This HTML generation approach supports dynamic text reflow and computed heights, ensuring layouts adapt correctly while maintaining a small 30KB footprint and zero external dependencies.

Do I need external dependencies or frameworks to deploy the generated CSS layout?

No external dependencies or frameworks are needed to deploy the generated CSS layout, because the output is production-ready, has zero dependencies, and maintains a small 30KB overhead.