published jul 1, 2026

Use Google’s Design.md Standard to Build a Consistent Brand

beginner

The Rundown

In this guide, you will learn how to use Google's open-source DESIGN.md format and Stitch skills to give an AI coding agent a reusable visual source of truth. You will build or extract a DESIGN.md, use it to create a local prototype, and learn how to improve the result without re-prompting brand style from scratch.

Who This Is Useful For

  • Founders and marketers who want quick mockups that still feel tied to an existing brand.
  • Designers and product teams who need AI tools to follow colors, typography, components, motion rules, and "do not use" guidance.
  • Developers and AI builders who want reusable design context inside Claude Code, Codex, Cursor, or another coding agent.

What You Will Build

You will install Google's Stitch skills, create or extract a DESIGN.md file, and use it to generate a lightweight local prototype. In our test, that file turned a rough Tiki bar idea into a visual system with a palette, typography, component rules, banned patterns, motion guidance, and a working "Tom's Tiki Drinks" prototype.

Tom's Tiki Drinks prototype homepage
Tom's Tiki Drinks prototype homepage

What You Need To Get Started

  • Claude Code, Codex, Cursor, or another supported coding agent. This guide uses Claude Code.
  • A project folder where the Stitch skills can install.
  • The Google Stitch skills repo (https://github.com/google-labs-code/stitch-skills).
  • A design idea, an existing website, or frontend source code to analyze.
  • Optional: a Google Stitch (https://stitch.withgoogle.com/) account and API key if you want the agent to push designs into Stitch.

Going Further

If you use Stitch directly, create an API key in Stitch settings and let the agent connect to your account. The Stitch skills can help push design systems and screens into Stitch so you can review them on a canvas and share them outside the coding agent.

You can also keep DESIGN.md in your repo like any other source file. Review diffs before a big redesign, keep one file per app or product surface, and hand the same file to Claude Code, Codex, Cursor, Stitch, or another AI builder.

Google's announcement (https://blog.google/innovation-and-ai/models-and-research/google-labs/stitch-design-md/) frames DESIGN.md as a portable way to import and export design rules, and the spec is still marked alpha. Treat it as a strong workflow pattern, not a finished replacement for designers, accessibility review, or brand approval.