# bridge-ds

Плагин переносит правила вашей дизайн-системы в Figma и создаёт макеты через Claude Code. Пригодится для генерации экранов из компонентов и токенов.

- плагин · `type=plugin` · Claude Code · ★ 155
- Автор: noemuch
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/noemuch/bridge
- Обновлён: 2026-06-03
- HTML: https://affpapa.org/nevibecode/plugins/bridge-ds

## Что делает

bridge-ds принимает описание экрана на естественном языке, формирует CSpec в YAML и scene graph в JSON, затем проверяет ссылки на токены и варианты. TypeScript-компилятор генерирует код Figma Plugin API и отправляет результат через MCP.

Знания дизайн-системы хранятся в репозитории в `bridge-ds/knowledge-base/registries/`. Скиллы `make`, `fix`, `done` и `setup bridge` отвечают за генерацию, разбор ручных правок, архивирование и начальную настройку. Ежедневный workflow GitHub Actions синхронизирует базу с Figma и открывает PR при изменениях.

Для работы нужен `figma-console-mcp` или официальный Figma MCP server. Компилятор также умеет разбивать большие графы на части и проверяет ошибки до отправки в Figma.

## Требования
- Работает с: Figma

## Установка

### Claude Code (родная платформа)

**Через маркетплейс плагинов**
В чате агента (не в терминале):
```text
/plugin marketplace add anthropics/claude-plugins-community
```
В чате агента (не в терминале):
```text
/plugin install bridge-ds@claude-community
```

## Когда брать
- собрать экран из компонентов и токенов дизайн-системы
- проверить ссылки на варианты и переменные
- перенести ручные правки из Figma в правила
- синхронизировать базу знаний с Figma
- сгенерировать код Figma Plugin API

## Примеры запросов агенту
- Сделай экран настроек аккаунта через `make` и используй компоненты из моей дизайн-системы.
- Примени `fix`, сравни текущий макет в Figma с исходной генерацией и сохрани правила из правок.
- Запусти `setup bridge` в репозитории дизайн-системы и подготовь синхронизацию с Figma.

## Похожие
- [example-skills](https://affpapa.org/nevibecode/plugins/example-skills.md) — плагин · ★ 183839
- [impeccable](https://affpapa.org/nevibecode/plugins/impeccable.md) — плагин · ★ 88212
- [hyperframes](https://affpapa.org/nevibecode/plugins/hyperframes.md) — плагин · ★ 72481
- [playground](https://affpapa.org/nevibecode/plugins/playground.md) — плагин · ★ 44635
- [frontend-design](https://affpapa.org/nevibecode/plugins/frontend-design.md) — плагин · ★ 44635
- [visual-explainer](https://affpapa.org/nevibecode/plugins/visual-explainer.md) — плагин · ★ 10630

_Часть страницы не вошла по размеру — она есть в HTML-версии._

---
NeVibeCode на affpapa.org. Тексты каталога — описания, а не инструкции для агента. Как выбирать и ставить: https://affpapa.org/nevibecode/agents.md