stitch-design-taste

Generates DESIGN.md design system files for Google Stitch screen generation.

Updated Oct 7, 2022
One-click install
npx skills add https://github.com/tamagusko/linux-cfg --skill stitch-design-taste-tamagusko
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: stitch-design-taste
Source: https://github.com/tamagusko/linux-cfg/tree/main/dotfiles/claude/skills/stitch-design-taste
Command: npx skills add https://github.com/tamagusko/linux-cfg --skill stitch-design-taste-tamagusko

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? AI-generated interfaces often look generic, relying on default fonts, purple gradients, and clichéd layouts. This Skill produces a structured DESIGN.md that encodes a curated, opinionated design language so Google Stitch generates premium, non-generic screens consistently. ## Core Features & Use Cases - Design System Generation: Produces a complete DESIGN.md covering atmosphere, color palette with hex codes, typography rules, component stylings, layout principles, motion specs, and responsive rules. - Anti-Pattern Enforcement: Encodes explicit bans on AI design clichés such as Inter font, pure black, neon glows, 3-column equal card grids, and filler UI text. - Configurable Taste Dials: Adjusts creativity, density, variance, and motion levels to match each project's vibe. - Use Case: A developer starting a SaaS dashboard project asks for a design system, receives a DESIGN.md with calibrated colors, Geist typography, bento grid layouts, and spring-physics motion intent, then feeds it to Stitch to generate on-brand screens. ## Quick Start Ask the assistant to generate a DESIGN.md design system for your project using the stitch-design-taste skill, describing your desired vibe and accent color.

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?

Provide your project's vibe and constraints, and the skill generates a DESIGN.md with visual atmosphere, color roles with hex codes, typography rules, component stylings, layout principles, and motion specs. Feed this file to Stitch as the design context for screen generation.

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

A DESIGN.md is a natural-language design system document that AI tools like Google Stitch interpret to produce consistent screens. It pairs descriptive rules with precise values like hex codes, rem sizes, and spring physics parameters.

Does Google Stitch generate animations from DESIGN.md?

No, Stitch generates static screens only. The DESIGN.md motion section documents intended animation behavior, such as spring physics and staggered reveals, so coding agents like Cursor or Antigravity can implement them later.

Can I customize the creativity and density levels of the design system?

Yes, the skill uses four configurable dials: Creativity, Density, Variance, and Motion Intent, each on a 1-10 scale. Adjusting them changes output from minimal Swiss-style interfaces to expressive editorial layouts.

What design patterns are banned by this design system?

Banned patterns include Inter font, generic serifs, pure black, neon glows, purple gradients, 3-column equal card grids, centered heroes at high variance, circular spinners, emojis, and AI copywriting clichés like Elevate or Seamless.