Об этом проекте
## Что это такое
design-md-hub — это репозиторий с открытым исходным кодом, содержащий 120 дизайн-систем брендов, каждая из которых представлена в виде одного текстового файла `DESIGN.md`, который могут читать ИИ-агенты для написания кода. Каждая спецификация воссоздана на основе работающего сайта бренда, поэтому записанные шрифты, значения hex, логотипы и тексты взяты из реального источника, а не угаданы. Значения, которые не удалось подтвердить по живому сайту, опущены.
## Что содержит DESIGN.md
- Цветовые палитры и семантические токены
- Шкалу типографики и выбор шрифтов
- Шаблоны и варианты компонентов
- Отступы, тени и радиус скругления углов
- Принципы макета и адаптивное поведение
- Тональность, ограничения и правила «что можно и чего нельзя»
Каждая папка бренда также содержит автономный файл `preview.html`, который открывается прямо в браузере без этапа сборки, что позволяет оценить визуальный стиль.
## Процесс работы, описанный в README
1. Загружается живой сайт бренда (HTML, CSS, шрифты) и извлекаются реальные токены.
2. Эти токены преобразуются в текстовую спецификацию `DESIGN.md`.
3. Соответствующий файл `preview.html` демонстрирует фирменный стиль в браузере.
4. ИИ-агент считывает `DESIGN.md` для генерации интерфейса в стиле этого бренда.
## Охват
Коллекция охватывает инструменты для разработчиков, продукты на базе ИИ/LLM, инструменты дизайна, финтех, аналитику, системы мониторинга (observability), приложения для продуктивности, сервисы авторизации, платформы данных, коммерцию и автоматизацию. Среди примеров: GitHub, Figma, Cursor, Linear, Stripe, Vercel, Supabase, Notion, Docker, MongoDB, Cloudflare, OpenAI, Claude, Mistral AI, ElevenLabs, Tailwind CSS, shadcn/ui, n8n, Zapier, Grafana и многие другие. Ссылка на сайт с живой галереей для просмотра превью доступна в README.
## Как использовать
1. Выберите `DESIGN.md` из представленной коллекции.
2. Скопируйте его в корень вашего проекта.
3. Дайте указание вашему ИИ-агенту следовать файлу `DESIGN.md` в корне проекта.
4. Генерируйте компоненты, страницы или целые приложения в едином стиле.
Не требуется никаких платных подписок, регистраций или API-ключей; предложения по улучшению принимаются через файл CONTRIBUTING.md в репозитории.
## Ограничения
В README указано, что эти спецификации являются неофициальными справочными материалами, созданными для обучения и прототипирования путем обратной разработки публичных сайтов брендов. Они не одобрены брендами и не связаны с ними. Товарные знаки и логотипы принадлежат их владельцам. Проект лицензирован под лицензией MIT.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.