# css-development

Настраивает работу Claude с CSS: композиция классов Tailwind, осмысленные имена и тёмная тема по умолчанию. Пригодится, когда стили в проекте разрастаются и их надо держать в порядке.

- плагин · `type=plugin` · Claude Code · ★ 97
- Автор: 2389-research
- Лицензия: MIT · policy=mirror · начало файла — в конце страницы
- Исходник: https://github.com/2389-research/claude-plugins/tree/HEAD/css-development
- Обновлён: 2026-10-21
- HTML: https://affpapa.org/nevibecode/plugins/css-development

## Что делает

Плагин накладывает на CSS-разработку три правила: классы Tailwind собираются по кускам, а не пишутся одной длинной строкой, имена получают смысл, а тёмная тема идёт базовым вариантом. Дальше агент придерживается этих правил, когда пишет или правит стили.

Внутри только описание воркфлоу из маркетплейса `claude-community`. Ставится штатно через маркетплейс, отдельной настройки не требует. Если проект на чистом CSS без Tailwind, композиция классов вам ничего не даст: правила заточены под утилитарный подход.

Тёмная тема по умолчанию значит, что светлый вариант придётся прописывать явно. Для нового проекта это нормально, для существующего с готовым светлым оформлением — повод сначала проглядеть, что именно поменяется в стилях.

## Установка

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

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

## Когда брать
- собрать классы Tailwind без длинных нечитаемых строк
- дать CSS-классам понятные имена вместо случайных
- сделать тёмную тему базовой, а не надстройкой
- держать единый стиль CSS, когда над проектом работает агент

## Примеры запросов агенту
- Сверстай карточку товара по правилам плагина: классы Tailwind через композицию, имена осмысленные, тёмная тема по умолчанию
- Перепиши стили в `styles.css`: разбей длинные строки классов Tailwind на части и назови их понятно
- Добавь в компонент светлую тему поверх тёмной по умолчанию

## Похожие
- [impeccable](https://affpapa.org/nevibecode/plugins/impeccable.md) — плагин · ★ 89321
- [hyperframes](https://affpapa.org/nevibecode/plugins/hyperframes.md) — плагин · ★ 73168
- [typescript-lsp](https://affpapa.org/nevibecode/plugins/typescript-lsp.md) — плагин · ★ 44770
- [playground](https://affpapa.org/nevibecode/plugins/playground.md) — плагин · ★ 44770
- [frontend-design](https://affpapa.org/nevibecode/plugins/frontend-design.md) — плагин · ★ 44770
- [fakechat](https://affpapa.org/nevibecode/plugins/fakechat.md) — плагин · ★ 44770

Из того же набора: [2389-research/claude-plugins](https://affpapa.org/nevibecode/by/2389-research/claude-plugins.md) — 10 карточек

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

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