google-labs-code/design.md

Что это?

Ключевые возможности

• 01Объединяет дизайн-токены YAML и пояснения в Markdown в одном файле.
• 02Команда lint проверяет структуру, ссылки на токены и коэффициенты контрастности WCAG.
• 03Команда diff показывает изменения отдельных токенов между двумя версиями дизайн-системы.
• 04Экспортирует токены в конфигурации Tailwind v3 и v4, а также в JSON W3C DTCG.
• 05Предоставляет API линтера для TypeScript и команду spec для добавления контекста в промпт.

Сценарии использования

• Передать coding agent постоянное описание цветов бренда, типографики и стилей компонентов.
• Проверять дизайн-систему в CI на некорректные ссылки на токены и недостаточную контрастность цветов компонентов.
• Синхронизировать дизайн-токены с проектом на Tailwind с помощью команды export.

Быстрый старт

1. 1

   Установить пакет CLI

   npm install @google/design.md
2. 2

   Проверить файл DESIGN.md

   npx @google/design.md lint DESIGN.md

Что важно знать

• !Формат находится в альфа-версии и может измениться по мере развития.
• !Проект не соответствует требованиям программы Google по вознаграждению за обнаружение уязвимостей в ПО с открытым исходным кодом.

Темы

Частые вопросы

Что такое design.md?

Спецификация формата и CLI для описания визуальной идентичности (дизайн-токены и пояснения), чтобы coding agents могли создавать согласованные интерфейсы. DESIGN.md — это формат файла для описания дизайн-системы coding agents. В каждом файле машиночитаемые дизайн-токены в YAML front matter сочетаются с текстом в Markdown, который объясняет, зачем нужны эти значения и как их применять. Токены задают точные цвета, типографику, отступы, скругления и свойства компонентов, а пояснения раскрывают замысел — например, тон, роли палитры и правила использования.

design.md можно использовать бесплатно? Какая у него лицензия?

design.md распространяется с открытым исходным кодом под лицензией Apache-2.0. Перед использованием в коммерческих продуктах проверьте условия лицензии.

design.md всё ещё поддерживается?

Активно поддерживается. Последний коммит в design.md — 16 окт. 2026 г..

Для чего можно использовать design.md?

Передать coding agent постоянное описание цветов бренда, типографики и стилей компонентов. Проверять дизайн-систему в CI на некорректные ссылки на токены и недостаточную контрастность цветов компонентов. Синхронизировать дизайн-токены с проектом на Tailwind с помощью команды export.

Как установить design.md?

Установить пакет CLI: npm install @google/design.md Проверить файл DESIGN.md: npx @google/design.md lint DESIGN.md

Где скачать design.md?

Исходный код и инструкции по установке — на GitHub: https://github.com/google-labs-code/design.md