design

Installation
SKILL.md

The Subframe MCP server exposes tools for the full design surface — pages, components, snippets, design documents, theme — and this skill teaches you when to reach for each one. Each tool returns a URL the user can open to see the result. The heaviest ones (design_page, design_component, edit_component) run as background AI jobs and also return a jobId — pass it to wait_for_jobs if you need to ensure completion.

Treat a Subframe design as an explicit output, not a prerequisite for UI coding. When the user requests a Subframe design artifact or meaningful design exploration, design in Subframe first and then implement with /subframe:develop if requested. For implementation-only requests, edit the code directly.

When to use this skill

Use this skill when the user wants to:

  • Create a page or screen in Subframe, materially redesign one, or explore visual directions
  • Add or edit a reusable Subframe component or snippet
  • Capture design intent or component usage guidance as a Subframe design document
  • Update the Subframe project's visual theme (colors, fonts, corners, shadows, typography)
  • Remove Subframe pages, components, snippets, or flows that are no longer needed

The key value: /subframe:design and /subframe:develop bridge coding and design. They work in both directions — create designs while coding and then ensure your code exactly reflects your design.

Picking the right tool

Installs
693
GitHub Stars
427
First Seen
Feb 6, 2026
design — subframeapp/subframe