Skip to main content
SkillJury
Back to registry

design

subframeapp/subframe

Design pages using the design_page and edit_page MCP tools. design_page creates AI-generated design variations that the user can preview and select. edit_page applies targeted changes directly to an existing Subframe page. Both produce designs the user can refine visually in the Subframe editor and then implement in...

Installs269
Install command
npx skills add https://github.com/subframeapp/subframe --skill design
Security audits
Gen Agent Trust HubPASS
SocketPASS
SnykPASS
About this skill
Design pages using the design_page and edit_page MCP tools. design_page creates AI-generated design variations that the user can preview and select. edit_page applies targeted changes directly to an existing Subframe page. Both produce designs the user can refine visually in the Subframe editor and then implement in code. Update the theme for the entire project using edit_theme . Don't write UI code directly. Subframe generates production-ready React/Tailwind code that matches the design system. Design first, then implement with /subframe:develop . Use /subframe:design when the user: 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.

Source description provided by the upstream skill listing. Community reviews and install context appear in the sections below.

Community Reviews

Latest reviews

Sign in to review

No community reviews yet. Be the first to review.

Browse this skill in context
FAQ
What does design do?

Design pages using the design_page and edit_page MCP tools. design_page creates AI-generated design variations that the user can preview and select. edit_page applies targeted changes directly to an existing Subframe page. Both produce designs the user can refine visually in the Subframe editor and then implement in...

Is design good?

design does not have approved reviews yet, so SkillJury cannot publish a community verdict.

What agent does design work with?

design currently lists compatibility with codex, gemini-cli, opencode, cursor, github-copilot, claude-code.

What are alternatives to design?

Skills in the same category include telegram-bot-builder, flutter-app-size, sharp-edges, iterative-retrieval.

How do I install design?

npx skills add https://github.com/subframeapp/subframe --skill design

telegram-bot-builderflutter-app-sizesharp-edgesiterative-retrieval
Related skills

More from subframeapp/subframe

develop

by subframeapp/subframe

266

Implement Subframe designs in the codebase. Fetch the design via MCP, sync components, and add business logic.

Software EngineeringFrontend and DesignFirst seen Feb 5, 2026
Related skills

Alternatives in Software Engineering

telegram-bot-builder

by sickn33/antigravity-awesome-skills

998

Source details, install context, and public review data are available on the full page.

Software EngineeringFrontend and DesignFirst seen Jan 18, 2026

flutter-app-size

by flutter/skills

996

Analyzes and optimizes Flutter application size by measuring build artifacts, generating size analysis reports, utilizing Dart DevTools for component breakdown, and implementing specific size reduction strategies such as debug info splitting, resource compression, and platform-specific tree-shaking. Assumes a...

Software EngineeringFrontend and Design

sharp-edges

by trailofbits/skills

994

Evaluates whether APIs, configurations, and interfaces are resistant to developer misuse. Identifies designs where the "easy path" leads to insecurity.

Software EngineeringFrontend and DesignFirst seen Jan 18, 2026

iterative-retrieval

by affaan-m/everything-claude-code

993

Solves the "context problem" in multi-agent workflows where subagents don't know what context they need until they start working.

Software EngineeringFrontend and DesignFirst seen Jan 25, 2026