stitch-design-taste

Generates DESIGN.md files encoding premium UI design standards for Google Stitch screen generation.

Updated Jul 10, 2026
One-click install
npx skills add https://github.com/Kaleb-Rupe/aurora --skill stitch-design-taste-kaleb-rupe
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: stitch-design-taste
Source: https://github.com/Kaleb-Rupe/aurora/tree/main/claude/skills/stitch-design-taste
Command: npx skills add https://github.com/Kaleb-Rupe/aurora --skill stitch-design-taste-kaleb-rupe

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? AI-generated interfaces often look generic, relying on overused fonts, neon gradients, and predictable layouts. This Skill produces a structured DESIGN.md that forces Google Stitch to follow a curated, anti-generic design language with strict typography, color, layout, and motion rules. ## Core Features & Use Cases - Semantic Design System Generation: Creates DESIGN.md files with descriptive color roles, hex codes, typography stacks, and component behaviors that Stitch's AI can interpret. - Configurable Taste Dials: Adjusts creativity, density, variance, and motion levels to match each project's vibe before generating the design system. - Anti-Pattern Enforcement: Encodes explicit bans on AI design clichés such as Inter font, pure black, neon glows, 3-column card rows, and filler UI text. - Use Case: A designer starting a SaaS dashboard project uses this Skill to generate a DESIGN.md, then feeds it to Google Stitch so every generated screen follows the same premium visual standard. ## Quick Start Generate a DESIGN.md design system for my analytics dashboard project with high variance and subtle motion, formatted for Google Stitch.

Frequently Asked Questions about stitch-design-taste

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

FAQPage Schema
How do I create a design system for Google Stitch?

Define the project atmosphere using density, variance, and motion dials, then document color roles with hex codes, typography stacks, component behaviors, and layout rules in a DESIGN.md file. Stitch interprets these natural-language descriptions paired with precise values to generate consistent screens.

What is a DESIGN.md file used for in Stitch?

A DESIGN.md file is the single source of truth that guides Google Stitch's screen generation. It encodes visual atmosphere, color calibration, typography architecture, component stylings, layout principles, motion philosophy, and banned anti-patterns in a semantic format Stitch's AI can interpret.

Can I use Stitch design systems with Cursor or other coding agents?

Yes, the DESIGN.md output works with the Stitch MCP Server for programmatic integration with Cursor, Antigravity, or Gemini CLI. The motion section specifically documents intended animation behavior so coding agents know how to implement spring physics and micro-interactions in live products.

Why does the design system ban the Inter font and pure black?

Inter and pure black (#000000) are banned because they signal generic AI-generated design. The system enforces distinctive alternatives like Geist, Outfit, or Satoshi, and uses Zinc-950 or Charcoal instead of pure black to achieve a premium, intentional aesthetic.

What are the limitations of Stitch-generated designs?

Stitch generates static screens and does not animate them. Motion intent must be documented separately in the DESIGN.md so a coding agent can implement spring physics, staggered reveals, and micro-loops when building the exported design into a live product.