gabelul/stitch-kit
36 skills · 1,240 total installs
$npx skills add gabelul/stitch-kitSkillInstalls
stitch-mcp-get-screenRetrieves full details of a specific Stitch screen — HTML download URL, screenshot URL, dimensions.stitch-setupStep-by-step installer for the stitch-kit plugin and Stitch MCP server.stitch-react-componentsConverts a Stitch screen, a local HTML file, or a URL into modular Vite + React components — TypeScript, theme-mapped Tailwind, dark mode via CSS variables,…stitch-design-mdAnalyzes a Stitch project's screens and synthesizes a natural-language DESIGN.md — visual atmosphere, color palette with hex values, typography rules, and…stitch-mcp-generate-screen-from-textGenerates a high-fidelity UI screen or wireframe from a text prompt using Stitch.stitch-ui-prompt-architectBuilds Stitch-ready prompts via two paths — Path A enhances vague ideas into polished prompts, Path B merges a Design Spec JSON + user request into a…stitch-design-systemExtracts a Stitch design and generates production code artifacts — CSS custom properties with dark mode tokens, a Tailwind v4 @theme block, and a semantic…stitch-nextjs-componentsConverts a Stitch screen, a local HTML file, or a URL into production-ready Next.js 15 App Router components — Server vs Client split, dark mode via CSS…stitch-ideateConversational design ideation agent that researches trends, explores visual directions, and refines ideas through adaptive questioning — then produces a rich…stitch-orchestratorMaster entry point for all Stitch design workflows. Routes from user request → design spec → prompt assembly → screen generation → iteration (edit, variants,…stitch-html-componentsConverts a Stitch screen, a local HTML file, or a URL into clean, platform-agnostic HTML5 + CSS — semantic markup, CSS custom properties for theming, dark mode…stitch-shadcn-uiIntegrates shadcn/ui into React apps generated from Stitch designs.stitch-animateAdds a purposeful animation layer to Stitch-generated components — CSS transitions, Framer Motion (React/Next.js), or Svelte transitions.stitch-mcp-create-design-systemCreates a reusable Stitch Design System from theme tokens — colors, fonts, roundness. Can be applied to future screens for visual consistency.stitch-ui-design-spec-generatorTranslates a user request or PRD document into a structured Design Spec JSON — theme, color, typography, density, and device type.stitch-react-native-componentsConverts a Stitch mobile screen, a local HTML file, or a URL into React Native / Expo components — TypeScript, StyleSheet, Expo Router, dark mode via…stitch-swiftui-componentsConverts a Stitch mobile screen, a local HTML file, or a URL into SwiftUI views for native iOS apps — VStack/HStack/ZStack layout mapping, Color asset tokens…stitch-mcp-edit-screensEdits existing Stitch screens with text prompts — the iteration tool. Change colors, layout, content, or style without regenerating from scratch.stitch-a11yAudits Stitch-generated components for WCAG 2.1 AA accessibility issues and applies fixes — semantic HTML, ARIA attributes, keyboard navigation, focus…stitch-mcp-list-projectsLists all Stitch projects accessible to the user. Use this to find an existing project ID before resuming work or generating new screens in an existing project.stitch-ui-design-variantsGenerates 3 alternative Stitch prompts for A/B testing screen concepts — vary layout, visual style, or content while keeping the underlying information…stitch-mcp-apply-design-systemApplies a Stitch Design System to existing screens — updates their colors, fonts, and roundness to match the design system's theme.stitch-mcp-list-design-systemsLists all Stitch Design Systems, optionally filtered by project. Returns asset names needed for apply and update operations.stitch-svelte-componentsConverts a Stitch screen, a local HTML file, or a URL into Svelte 5 / SvelteKit components using the runes API — scoped CSS with custom properties, built-in…stitch-loopIteratively build multi-page websites using Stitch. Reads next-prompt.md (the baton), generates the next page with Stitch MCP, integrates it into the site,…stitch-mcp-create-projectCreates a new Stitch project container (a design workspace). Call this when starting a new design session to get a projectId for screen generation.stitch-mcp-get-projectRetrieves metadata for a specific Stitch project — title, theme, create/update time. Use to inspect a project before generating new screens.stitch-mcp-list-screensLists all screens in a Stitch project. Use this after generate_screen_from_text to find the screenId of the newly generated screen, then call…stitch-mcp-update-design-systemUpdates an existing Stitch Design System's theme, tokens, or guidelines. Requires the asset name from create or list operations.stitch-mcp-generate-variantsGenerates design variants of existing Stitch screens using the native variant API.stitch-remotionGenerates walkthrough videos from Stitch projects using Remotion.stitch-skill-creatorMeta-skill for creating new stitch-kit skills. Enforces naming conventions, SKILL.md structure, examples format, and the Design-First SOP.stitch-ued-guideVisual vocabulary, design terminology, and prompt engineering strategy for Stitch.stitch-mcp-delete-projectPermanently deletes a Stitch project and all its screens. Destructive — requires explicit user confirmation before calling.stitch-mcp-create-design-system-from-design-mdCreates a Stitch Design System from a DESIGN.md that was already uploaded with stitch-mcp-upload-design-md.stitch-mcp-upload-design-mdUploads a DESIGN.md file to a Stitch project as the first half of turning it into a Stitch Design System.