Что это такое
Awesome DESIGN.md — каталог файлов, которые описывают дизайн-систему в текстовом виде. Идея простая: если AI-агенту или команде нужен интерфейс “в стиле продукта”, нужны правила: типографика, цвет, плотность, компоненты, тон и ограничения.
Репозиторий отражает сдвиг в разработке интерфейсов: дизайн-система становится не только Figma-библиотекой, но и машиночитаемым контекстом для генерации кода. DESIGN.md можно версионировать рядом с проектом.
Что внутри и как используют
Внутри — подборка DESIGN.md и разборов популярных брендовых систем. Такой файл может объяснять кнопки, карточки, отступы, запрещенные паттерны и визуальные отличия продукта.
Мини-структура DESIGN.md
Пример показывает, какие правила можно держать рядом с кодом, чтобы интерфейсы не расползались по стилю.
# DESIGN.md
## Typography
Use compact headings and readable body text.
## Layout
Prefer strict grids and clear section boundaries.
## Components
Buttons are rectangular. Cards are only for repeated items.
## Avoid
Decorative blobs, random gradients, and oversized hero sections.Типовой сценарий — добавить DESIGN.md в проект и дать агенту учитывать его при генерации экранов. Это помогает не повторять одни и те же ограничения в каждом запросе.
Сильные стороны и ограничения
Сильная сторона — перенос дизайна в текстовый контракт. Это удобно для AI-разработки, проверки кода и долгоживущих проектов, где визуальные правила должны быть рядом с кодом.
Ограничение — текст не заменяет настоящие компоненты и визуальные проверки. DESIGN.md задает направление, но итог нужно смотреть в браузере, сравнивать с макетами и проверять реальные состояния.