skills.rest
javiruu
javiruuCOMMUNITY
Explore all skills by this author →
GitHub

stitch-design-taste

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

Updated Mar 26, 2026
Search Tags:#typography#frontend#design system#design tokens#ui design#design.md#google stitch
One-click install
npx skills add https://github.com/javiruu/viru-air --skill stitch-design-taste-javiruu
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: stitch-design-taste
Source: https://github.com/javiruu/viru-air/tree/main/.agents/skills/stitch-design-taste
Command: npx skills add https://github.com/javiruu/viru-air --skill stitch-design-taste-javiruu

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? AI-generated UI screens often look generic, using default fonts, purple gradients, and predictable card layouts. This Skill produces a structured DESIGN.md file that encodes a curated, opinionated design language so Google Stitch generates premium, non-generic interfaces. ## Core Features & Use Cases - Design System Generation: Creates a complete DESIGN.md covering color palettes with hex codes, typography rules, component stylings, layout principles, and motion specs. - Anti-Pattern Enforcement: Encodes explicit banned patterns (Inter font, pure black, neon glows, 3-column card grids, AI copywriting clichés) to prevent generic output. - Configurable Taste Dials: Adjusts creativity, density, variance, and motion levels to match each project's vibe. - Use Case: A developer starting a new SaaS dashboard uses this Skill to generate a DESIGN.md, then feeds it to Google Stitch so every generated screen follows the same calibrated visual language. ## 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?▼

Generate a DESIGN.md file describing visual atmosphere, color palette with hex codes, typography rules, component stylings, layout principles, and motion intent. Stitch interprets these natural-language visual descriptions to generate screens matching your design language.

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

A DESIGN.md file acts as the single source of truth for prompting Google Stitch to generate new screens. It encodes semantic design rules with specific values so Stitch's AI agent produces consistent, non-generic interfaces across all generated screens.

How do I avoid generic AI-generated UI design?▼

Encode explicit anti-patterns in your design system: ban the Inter font, pure black, neon glows, 3-column equal card grids, centered heroes, and AI copywriting clichés. Use distinctive fonts like Geist or Satoshi and a single calibrated accent color below 80% saturation.

Does Google Stitch generate animations directly?▼

No, Stitch generates static screens and does not animate. The DESIGN.md documents intended motion behavior, such as spring physics and staggered reveals, so coding agents like Cursor or Antigravity can implement the animations when building the live product.

Can I adjust the creativity level of the generated design system?▼

Yes, the system uses configurable dials for creativity, density, variance, and motion intent on a 1-10 scale. Low creativity produces quiet minimal interfaces, while high creativity yields editorial layouts with inline image typography and strong asymmetry.

Related Skills

Explore More Design & Creative Skills→
rampstackcorampstackco
523

art-direction

Translate brand identity into cohesive art-direction briefs for creative teams.

Official
Advanced
tanveerriaztanveerriaz
1

stitch-design-taste

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

Community
Intermediate
adilkalamadilkalam

design-qa-skill

Automate design QA checks across breakpoints and generate severity-scored reports.

Community
Basic
EdgeHuntEdgeHunt

ck:ui-styling

Streamline React UI styling with shadcn/ui and Tailwind CSS design systems.

Official
Advanced