design-html

Generate production-ready HTML/CSS from approved AI mockups and export PDF, PPTX, MP4, and GIF assets.

1|Updated Mar 31, 2026
One-click install
npx skills add https://github.com/LaPaGaYo/nexus --skill design-html-lapagayo
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: design-html
Source: https://github.com/LaPaGaYo/nexus/tree/main/skills/support/design-html
Command: npx skills add https://github.com/LaPaGaYo/nexus --skill design-html-lapagayo

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Bridges the gap between design mockups and live HTML/CSS by producing production-ready code and downstream exports from a validated design, enabling designers to hand off polished, ready-to-ship interfaces without rework.

Core Features & Use Cases

  • Production-ready HTML/CSS generation from an approved AI mockup.
  • Downstream exports for prototypes, slide decks, motion pieces, and infographics.
  • Smart API routing: picks the right Pretext patterns for each design type and drives PDF/PPTX/MP4/GIF/verification steps from the approved deliverable metadata.

Quick Start

Run this skill to convert an approved design from /design-shotgun into production HTML/CSS and export supporting assets.

Frequently Asked Questions about design-html

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

FAQPage Schema
How do I convert an approved design mockup into production-ready HTML and CSS?

You can generate production-ready HTML and CSS from an approved AI mockup using this skill, which applies smart API routing to pick the right Pretext patterns for your specific design type.

Can I export HTML designs to PDF, PPTX, MP4, and GIF formats?

Yes, you can export HTML designs to PDF, PPTX, MP4, and GIF formats. The skill drives these downstream exports directly from the approved deliverable metadata for prototypes, slide decks, motion pieces, and infographics.

What is the best way to automate design handoff from mockups to live HTML code?

The best way to automate design handoff from mockups to live HTML code is to use a skill that bridges the gap by producing production-ready code from a validated design, enabling designers to hand off polished, ready-to-ship interfaces without rework.

Does design-html work with design-shotgun outputs?

Yes, design-html works with design-shotgun outputs. It turns approved mockups from the /design-shotgun direction into production HTML and proactively suggests design improvements once a direction is approved.

How do downstream exports from HTML prototypes work?

Downstream exports from HTML prototypes work by driving PDFs, PPTX, MP4s, GIFs, and verification steps directly from the approved deliverable metadata, allowing you to output assets for prototypes, slides, motion pieces, and infographics.

When should I not use automated design to HTML conversion?

You should not use automated design to HTML conversion if your mockup is not yet an approved AI deliverable, because this skill requires a validated design direction to generate production-ready code and trigger downstream exports accurately.