stitch-design-taste

Generate DESIGN.md files for Google Stitch with specified visual rules.

Updated Apr 3, 2026
One-click install
npx skills add https://github.com/kirvin/agent-dev-harness --skill stitch-design-taste-kirvin
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: stitch-design-taste
Source: https://github.com/kirvin/agent-dev-harness/tree/main/plugins/kf/skills/stitch-design-taste
Command: npx skills add https://github.com/kirvin/agent-dev-harness --skill stitch-design-taste-kirvin

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires stitch, stitch-mcp-server, and includes scripts (resource) and references (resource) and assets (resource) components.

What problem does it solve?

This Skill helps streamline the design process for Google Stitch, generating DESIGN.md files that enforce strict UI standards for typography, color, layout, and more.

Core Features & Use Cases

  • Design Standards Enforcement: Ensures premium, non-generic UI standards for typography, color, layout, and motion.
  • Semantic Design Language: Translates design directives into a language that Stitch's AI agent can interpret.
  • Visual Descriptions: Creates descriptive rules paired with precise values for AI interpretation.
  • Use Case: For a project using Google Stitch, apply this Skill to define a DESIGN.md file for consistent, high-agency design across screens.

Quick Start

Use the stitch-design-taste skill to create a DESIGN.md file for your project with the following command: stitch-design-taste --atmosphere "Art Gallery Airy" --palette "Neutral Base" --typography "Geist" --hero-image "example.jpg" --components "Buttons, Cards" --layout "Asymmetric" --motion "Spring Physics" --banned-patterns "Generic Serif Fonts, Neon Colors, 3-Column Grids".

Frequently Asked Questions about stitch-design-taste

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I enforce consistent UI design standards for Google Stitch projects?

To enforce consistent UI design standards for Google Stitch, you can generate a DESIGN.md file containing semantic rules for typography, color palettes, layout principles, and motion philosophy that the AI agent interprets.

What is a DESIGN.md file used for in AI UI generation?

A DESIGN.md file is used in AI UI generation to translate visual atmosphere and component stylings into a semantic design language, ensuring the AI agent applies premium, non-generic standards across all screens.

Do I need the Stitch MCP Server to define semantic design rules?

You do not strictly need the Stitch MCP Server to define semantic design rules, but integrating it alongside Google Stitch allows the generated DESIGN.md file to enforce strict typography and color standards more effectively.

How do I prevent generic UI outputs when using Google Stitch?

To prevent generic UI outputs when using Google Stitch, you can specify banned-patterns in your DESIGN.md file, such as prohibiting generic serif fonts, neon colors, or 3-column grids during the design standards generation.

What's the best way to configure typography and color palettes for Stitch's AI agent?

The best way to configure typography and color palettes for Stitch's AI agent is to define precise values paired with visual descriptions in a DESIGN.md file, translating design directives into a language the agent can interpret.

Can I specify motion philosophy and layout principles for Google Stitch?

You can specify motion philosophy and layout principles for Google Stitch by including parameters like Spring Physics and Asymmetric layouts in your DESIGN.md file, generating strict rules for the AI agent to follow.