Trần Hoài Nam
Community@tranhoainam298
Stitch MCP skill suite for generating UI screens, extracting design systems from frontend code, and converting designs to React, React Native, and Remotion video.
Agent Skills by Trần Hoài Nam
Showing 14 vetted skills indexed across 1 GitHub repositories.
tranhoainam298stitch::generate-design
Generate and edit UI screens from text prompts or images using Stitch MCP.
tranhoainam298stitch::code-to-design
Convert frontend code into Stitch Designs by extracting HTML and design systems.
tranhoainam298stitch::extract-static-html
Extract self-contained static HTML from running web apps by inlining CSS and images.
tranhoainam298stitch::extract-design-md
Extract a design system document from frontend source code without building the app.
tranhoainam298stitch::manage-design-system
Create, update, and apply Stitch design systems from DESIGN.md files using MCP tools.
tranhoainam298stitch::upload-to-stitch
Upload images, HTML, and markdown files to Stitch projects via the BatchCreateScreens API.
tranhoainam298design-md
Analyzes Stitch project screens and generates a semantic DESIGN.md design system document.
tranhoainam298taste-design
Generates DESIGN.md design system files for Google Stitch screen generation.
tranhoainam298enhance-prompt
Transforms vague UI ideas into structured, Stitch-optimized generation prompts.
tranhoainam298stitch-loop
Generates website pages iteratively with Stitch MCP tools using a baton-passing loop pattern.
tranhoainam298stitch::react-native
Convert Stitch HTML designs into React Native components with StyleSheet styling.
tranhoainam298shadcn-ui
Integrates and customizes shadcn/ui components in React applications with Tailwind CSS.
tranhoainam298stitch::react-components
Converts Stitch designs into modular Vite and React components with AST-based validation.
tranhoainam298remotion
Generate walkthrough videos from Stitch project screens using Remotion compositions.
Frequently Asked Questions About Trần Hoài Nam
FAQPage SchemaWhat tasks can I accomplish with tranhoainam298's Stitch skills?▼
You can generate UI screens from text prompts or images, extract static HTML and design systems from frontend codebases, upload assets to Stitch projects, convert designs to React or React Native components, integrate shadcn/ui components, and render Remotion walkthrough videos.
Who should use these Stitch design skills?▼
Frontend engineers and UI designers migrating existing web apps into Stitch, design system maintainers auditing tokens and Tailwind configs, and mobile developers syncing Stitch designs to React Native StyleSheet components benefit most from this manifest.
How does the code-to-design pipeline work in practice?▼
The pipeline chains three steps: extract-static-html inlines CSS and images into self-contained HTML, extract-design-md analyzes components and Tailwind configs into a DESIGN.md, and upload-to-stitch pushes assets to a Stitch project, bypassing base64 token limits.
What prerequisites and permissions do these skills require?▼
Skills require access to Stitch MCP servers (stitch*:* tools), plus Read, Write, Bash, and web_fetch permissions. The shadcn-ui skill needs shadcn MCP access, stitch-loop needs Chrome tooling, and remotion needs the Remotion MCP server.
Can these skills improve prompt quality for UI generation?▼
Yes. The enhance-prompt skill transforms vague UI ideas into Stitch-optimized prompts with specific UI/UX keywords and design system context, while taste-design enforces premium standards covering typography, calibrated color, asymmetric layouts, and hardware-accelerated micro-motion.