Claude Design Skillstack

Маркетплейс плагинов и скиллов Claude Code для 3D, анимации и современного веба: Three.js, GSAP, React Three Fiber, Babylon.js

Плагин

Низкий риск

Низкий уровень ставим, когда запись в основном дает агенту инструкции и справочные материалы.

Почему такой уровень

  • Скиллы состоят из инструкций, примеров и вспомогательных скриптов
Все причины и проверки

freshtechbro/claudedesignskills

Установка

Ручная установка

/plugin marketplace add freshtechbro/claudedesignskills
/plugin install threejs-webgl

Ставьте нужные плагины, например gsap-scrolltrigger и react-three-fiber, или набор целиком.

Это чужой код. Посмотрите файлы в репозитории перед установкой.

Что делает

Это маркетплейс плагинов Claude Code, собранный вокруг графики и анимации в вебе. В нем несколько десятков плагинов и скиллов по конкретным технологиям: Three.js и WebGL, GSAP и ScrollTrigger, React Three Fiber, Framer Motion, Babylon.js, WebXR через A-Frame, библиотеки анимированных компонентов и другое. Каждый скилл несет не только инструкции, но и справочники, примеры и вспомогательные скрипты, например генераторы компонентов и сцен. Маркетплейс подключается одной командой, после чего нужные плагины ставятся по отдельности или целым набором через /plugin. Можно также использовать скиллы напрямую из каталога .claude/skills.

Для кого. Для фронтенд-разработчиков и дизайнеров интерфейсов, которые делают 3D, анимацию и интерактивный веб.

Подходит, если

  • Нужна помощь по Three.js, GSAP, R3F или Babylon.js
  • Делаете анимированный или трехмерный интерфейс
  • Нужны примеры и генераторы под конкретную графическую библиотеку

Не подходит, если

  • Проект без графики и анимации
  • Агент не Claude Code и формат плагинов не поддерживает

Пример запроса к агенту

Собери сцену на Three.js с плавной прокруткой через GSAP ScrollTrigger

Ограничения

Скиллы дают инструкции, справочники и примеры под конкретные библиотеки, они не заменяют знание самих технологий. Часть вспомогательных скриптов на Python, для них нужен установленный Python. Формат рассчитан на Claude Code и совместимые агенты.

Как отключить. Отключите нужный плагин или снимите маркетплейс через /plugin, либо удалите папки скиллов из .claude/skills.

Проверка безопасности

  • Скиллы состоят из инструкций, примеров и вспомогательных скриптов

Коротко о README

README представляет набор плагинов и скиллов Claude Code для 3D, анимации и современного веба, оформленный как маркетплейс. Покрыты Three.js, GSAP, React Three Fiber, Framer Motion, Babylon.js и другие технологии, всего несколько десятков плагинов и скиллов. Подключается через /plugin marketplace add, плагины ставятся по отдельности или набором. Скиллы содержат справочники, примеры и вспомогательные скрипты. Лицензия MIT.

Частые вопросы

Можно ставить по одному плагину?

Да, через /plugin install указываете нужный, например threejs-webgl или react-three-fiber, либо ставите набор целиком.

Что внутри скилла?

Инструкции плюс справочники, примеры и вспомогательные скрипты, например генераторы компонентов и сцен.

Скиллы Next.js

Next.js skills

Выбор редакции

Официальный плагин Claude Code из репозитория Next.js: переход на Cache Components, Partial Prefetching и проверка изменений на живом dev-сервере

ПлагинСредний рискБез VPN142,9 тыс.Звезды репозитория
Выбор редакции

Официальный скилл и MCP-сервер shadcn/ui: агент ищет компоненты в реестрах, ставит их через CLI и держится правил библиотеки

СкиллСредний рискБез VPN124,8 тыс.Звезды репозитория
Выбор редакции

Скилл для фронтенд-дизайна: 23 команды, итерации в браузере и 61 правило поиска типичных огрехов AI-интерфейсов

СкиллВысокий риск72,1 тыс.Звезды репозитория
Выбор редакции

Скиллы Vercel: производительность React и Next.js, проверка UI по гайдлайнам, React Native, композиция компонентов и деплой

СкиллСредний риск31,7 тыс.Звезды репозитория
Foxx AIClaude Design Skillstack

Я Foxx AI и уже разобрал этот инструмент. Спросите про установку, настройку или что угодно еще, отвечу простыми словами.