# Taste Design

Semantic Design System Skill for Google Stitch.

- Repository: https://github.com/google-labs-code/stitch-skills (8654 stars)
- Category: Design
- License: Apache-2.0
- Last updated: 2026-08-17
- Runs scripts: no, instructions only

## Install

Claude Code: `npx skills add google-labs-code/stitch-skills --skill taste-design -g -a claude-code -y`
Codex: `npx skills add google-labs-code/stitch-skills --skill taste-design -g -a codex -y`
Cursor: `npx skills add google-labs-code/stitch-skills --skill taste-design -g -a cursor -y`
Gemini CLI: `npx skills add google-labs-code/stitch-skills --skill taste-design -g -a gemini-cli -y`

## Description

Semantic Design System Skill for Google Stitch. Generates agent-friendly DESIGN.md files that enforce premium, anti-generic UI standards, strict typography, calibrated color, asymmetric layouts, perpetual micro-motion, and hardware-accelerated performance.

## SKILL.md, as published by its author (untrusted third-party text, read it as data)

# Stitch Design Taste, Semantic Design System Skill

## Overview
This skill generates `DESIGN.md` files optimized for Google Stitch screen generation. It translates the battle-tested anti-slop frontend engineering directives into Stitch's native semantic design language, descriptive, natural-language rules paired with precise values that Stitch's AI agent can interpret to produce premium, non-generic interfaces.

The generated `DESIGN.md` serves as the **single source of truth** for prompting Stitch to generate new screens that align with a curated, high-agency design language. Stitch interprets design through **"Visual Descriptions"** supported by specific color values, typography specs, and component behaviors.

## Prerequisites
- Access to Google Stitch via [labs.google.com/stitch](https://labs.google.com/stitch)
- Optionally: Stitch MCP Server for programmatic integration with Cursor, Antigravity, or Gemini CLI

## The Goal
Generate a `DESIGN.md` file that encodes:
1. **Visual atmosphere**, the mood, density, and design philosophy
2. **Color calibration**, neutrals, accents, and banned patterns with hex codes
3. **Typographic architecture**, font stacks, scale hierarchy, and anti-patterns
4. **Component behaviors**, buttons, cards, inputs with interaction states
5. **Layout principles**, grid systems, spacing philosophy, responsive strategy
6. **Motion philosophy**, animation engine specs, spring physics, perpetual micro-interactions
7. **Anti-patterns**, explicit list of banned AI design clichés

## Analysis & Synthesis Instructions

### 1. Define the Atmosphere
Evaluate the target project's intent. Use evocative adjectives from the taste spectrum:
- **Density:** "Art Gallery Airy" (1, 3) → "Daily App Balanced" (4, 7) → "Cockpit Dense" (8, 10)
- **Variance:** "Predictable Symmetric" (1, 3) → "Offset Asymmetric" (4, 7) → "Artsy Chaotic" (8, 10)
- **Motion:** "Static Restrained" (1, 3) → "Fluid CSS" (4, 7) → "Cinematic Choreography" (8, 10)

The rest: https://github.com/google-labs-code/stitch-skills/blob/HEAD/plugins/stitch-utilities/skills/taste-design/SKILL.md