Skip to content
Get packs

Taste Design for Stitch

Generates DESIGN.md style guides that steer Google Stitch toward premium, non-generic UI.

Source Download skill
Repository
google-labs-code/stitch-skills
Stars
8,657
Licence
Apache-2.0
Files
2 files

What it does

This skill teaches an AI agent to write a DESIGN.md file, a plain-language design brief with specific colors, fonts, layout and motion rules. You then give that file to Google Stitch, an AI screen generator, so the screens it creates follow a curated, less generic visual style. The skill covers things like banned fonts, a single accent colour, asymmetric layouts, and smooth spring-based animation.

Great for

  • Designers or front-end developers who use Google Stitch and want consistent, distinctive screens
  • Teams that want a reusable design brief that AI tools can follow across many generated screens

Skip it if

  • Projects that need a specific existing brand system, since the skill imposes its own opinionated defaults (e.g. banning Inter and centered heroes) that may conflict with brand guidelines
  • Users who expect a finished, tested component library; the output is design guidance, not production code

Try asking

  • “Create a DESIGN.md for a premium fintech dashboard with high density and minimal colour”
  • “Generate a DESIGN.md for an editorial creative portfolio with asymmetric layouts”
  • “Write a design system brief for a mobile-first wellness app and then use it to prompt Stitch”
Step-by-step guide: how to use Taste Design for StitchInstall, first run, examples, tips and FAQs

Install in 3 steps

  1. 1

    Download the skill

    The ZIP contains the 2 original files, the Apache-2.0 licence and an attribution note.

    taste-design.zip
  2. 2

    Add it to your agent

    Claude Code (all projects)

    mkdir -p ~/.claude/skills && unzip taste-design.zip -d ~/.claude/skills/

    Claude Code / Agent SDK (this project only)

    mkdir -p .claude/skills && unzip taste-design.zip -d .claude/skills/

    Claude apps (web/desktop): Settings → Capabilities → Skills → Upload skill, and choose the ZIP.

  3. 3

    Ask for the task

    No special command needed — the agent reads the skill's description and loads it when your request matches. Try one of the prompts above.

Get better results

  • Describe the target product's mood and audience up front, since the skill adapts density, variance and motion levels to your description
  • Review the generated hex codes and font choices against any existing brand rules before sending the DESIGN.md to Stitch
  • Expect strong opinions: if you need conventional layouts or fonts such as Inter, edit the generated DESIGN.md before use

What's inside

  • resources/DESIGN.md
  • SKILL.md

Redistributed unmodified from google-labs-code/stitch-skills under the Apache-2.0 licence. The assessment was drafted with AI from the skill's files on 2026-10-29. Skills can instruct your agent to run code — read SKILL.md and any scripts before installing.