Panda — это универсальный, типобезопасный CSS-in-JS фреймворк для дизайн-систем. Он извлекает стили во время сборки, генерирует современный CSS с каскадными слоями и переменными, поддерживает рецепты и варианты.
Открытый код. Новые возможности.
Находите качественные проекты с открытым исходным кодом, отправляйте проекты анонимно, заявляйте права на свои проекты и редактируйте их.
Немного любопытства. Мир открытого кода.
THE FIRST COLLECTIONDembrandt — open-source CLI для Node.js, который рендерит сайт через Playwright, считывает вычисленные DOM-стили и преобразует цвета, типографику, отступы, границы, тени, анимацию и компоненты в токены W3C. Поддерживает CI-гейты дрейфа и MCP для интеграции с AI-агентами.
oh-my-design устанавливает ссылки на системы дизайна и навыки в ИИ‑агенты для программирования. Одна команда добавляет более 440 ссылок на дизайн компаний, 28 навыков и 20 специализированных ролей в Claude Code, Codex, Cursor и OpenCode. Генерирует портативный DESIGN.md с философией, токенами и контрактами компонентов.
Chromatic — это инструмент сборки для управления кроссплатформенными дизайн-системами на основе файлов дизайн-токенов. Он поддерживает выражения, темы, YAML/JSON и генерирует Sass, CSS, iOS, Android и HTML.
Легкая, модульная и настраиваемая дизайн-система на чистом CSS, использующая CSS-переменные, принципы mobile-first и стандарты доступности. Включает примеры, дизайн-токены, скрипты сборки и линтинга, а также готовый CSS-файл для CDN.
DesignMD — утилита CLI для извлечения живых дизайн-систем с любого URL: цветов, типографики, отступов, брейкпоинтов и интерактивных состояний с выводом в портативный DESIGN.md, оптимизированный для AI-ассистентов.
Коллекция из 120 спецификаций дизайна брендов в формате простого текста DESIGN.md, воссозданных на основе реальных сайтов, что позволяет ИИ-агентам генерировать UI в фирменном стиле. Каждый бренд включает реальные цвета, типографику, компоненты и правила, а также автономный файл preview.html.
Codex — это дизайн-система Wikimedia, предлагающая компоненты Vue 3 и CSS, дизайн-токены, иконки и сайт документации на VitePress. Она поддерживает интернационализацию и соответствует стандартам доступности WCAG 2.1 AA.
designlang — open-source CLI на основе Playwright для извлечения дизайн-системы с живого сайта: токены DTCG, Tailwind, Figma, shadcn, компоненты, анимации, WCAG-аудит и мультиплатформенные эмиттеры.
Курируемая англоязычная коллекция закладок, ресурсов, статей и инструментов по дизайн-системам для разработчиков, охватывающая инструменты дизайна, дизайн-токены, библиотеки паттернов, тестирование компонентов, книги и доклады.
Tinte компилирует дизайн-систему в Agent Plugin: извлекает айдентику, создает SKILL.md и tokens.css, а также проверяет соответствие цветов токенам. Конфигурация также генерирует пресеты shadcn и темы для редакторов.
Коллекция DESIGN.md-файлов, извлечённых с реальных сайтов и брендов. Поместите DESIGN.md в проект — и AI-агент создаст UI, соответствующий визуальной идентичности бренда.
Better Design — это open-source MCP-сервер и реестр shadcn/ui, предоставляющий AI-агентам дизайн-системы, семантические CSS-токены, принципы UI, сопоставление иконок и правила проверки WCAG.
brandmd — это CLI-инструмент, который извлекает дизайн-систему веб-сайта в файл DESIGN.md, соответствующий спецификации @google/design.md, предоставляя контекст бренда для Claude Code, Cursor и других ИИ-агентов.
GlassKit — это библиотека CSS-компонентов без зависимостей в стиле глассморфизма, вдохновленная iOS 26 Liquid Glass. Она включает темы, дизайн-токены, утилитарные классы и Constructable Stylesheet для Shadow DOM.
Claude-скилл для аудита и создания дизайн-систем Figma: режим inspect (WCAG, токен-комплаенс, интерактивные состояния) и режим build с шестифазным workflow для генерации компонентов, слотов, токенов и AI-правил.
Marigold — это реализация Marigold Design System на React, созданная с использованием react-aria и Tailwind CSS. Монорепозиторий включает пакеты компонентов и тем, Storybook, документацию на Next.js, тесты Vitest и релизы через Changesets.
Design Oracle анализирует веб-сайты с помощью Playwright для извлечения дизайн-системы (цвета, типографика, компоненты) и экспортирует конфигурации Tailwind v4, React JSX, JSON-токены или отчет DESIGN.md. Работает автономно или как MCP-сервер для ИИ-агентов.