feat: responsive variants + design-to-code prompt

Responsive variants: $D variants --viewports desktop,tablet,mobile
generates mockups at 1536x1024, 1024x1024, and 1024x1536 (portrait)
with viewport-appropriate layout instructions.

Design-to-code prompt: $D prompt --image approved.png extracts colors,
typography, layout, and components via GPT-4o vision, producing a
structured implementation prompt. Reads DESIGN.md for additional
constraint context.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
Garry Tan
2026-03-26 22:23:41 -06:00
parent 1d9b2dac80
commit dbf6b4ada7
4 changed files with 184 additions and 2 deletions

View File

@@ -54,6 +54,11 @@ export const COMMANDS = new Map<string, {
usage: "verify --mockup approved.png --screenshot live.png",
flags: ["--mockup", "--screenshot", "--output"],
}],
["prompt", {
description: "Generate structured implementation prompt from approved mockup",
usage: "prompt --image approved.png",
flags: ["--image"],
}],
["extract", {
description: "Extract design language from approved mockup into DESIGN.md",
usage: "extract --image approved.png",