Skills/Сложные HTML-артефакты

Сложные HTML-артефакты

5 мая 2026

Инструменты Anthropic для многокомпонентных артефактов на React, Tailwind CSS и shadcn/ui — когда нужны состояние, маршрутизация и готовые компоненты.

Описание

РазработкаБесплатно

Инструменты Anthropic для многокомпонентных артефактов на React, Tailwind CSS и shadcn/ui — когда нужны состояние, маршрутизация и готовые компоненты.

Название
Сложные HTML-артефакты
Категория
Разработка
Что умеет
  • собирает артефакты на React
  • подключает Tailwind и shadcn/ui
  • поддерживает состояние и маршруты
  • упаковывает всё в один HTML
Источник
anthropics/skills
Где работает
Claude Code и другие агенты, которые читают .claude/skillsКак устроены навыки
Куда ставить
Навык работает только в текущем проекте.
Как установить
  1. 1Скопируйте команду из блока «Установка» ниже и выполните её в терминале.
  2. 2Навык появится в папке .claude/skills/web-artifacts-builder/
  3. 3Откройте новую сессию Claude Code — навык подхватится автоматически.

Что внутри

npx degit anthropics/skills/skills/web-artifacts-builder .claude/skills/web-artifacts-builder
.claude/skills/
└── web-artifacts-builder/
    └── SKILL.md

Действия

Открыть на GitHubДокументация
НазадBetter Auth: лучшие практикиДалееCloudflare: выбор продуктов
.claude/skills/web-artifacts-builder/SKILL.md
  1. 1---
  2. 2name: web-artifacts-builder
  3. 3description: "Инструменты Anthropic для многокомпонентных артефактов на React, Tailwind CSS и shadcn/ui — когда нужны состояние, маршрутизация и готовые компоненты."
  4. 4---
  5. 5​
  6. 6# Сложные HTML-артефакты
  7. 7​
  8. 8Инструменты Anthropic для многокомпонентных артефактов на React, Tailwind CSS и shadcn/ui — когда нужны состояние, маршрутизация и готовые компоненты.
  9. 9​
  10. 10## Что делает
  11. 11​
  12. 12- Собирает артефакты на React
  13. 13- Подключает Tailwind и shadcn/ui
  14. 14- Поддерживает состояние и маршруты
  15. 15- Упаковывает всё в один HTML
  16. 16​
  17. 17## Где работает
  18. 18​
  19. 19Claude Code и другие агенты, которые читают .claude/skills.
  20. 20​
  21. 21## Установка
  22. 22​
  23. 231. Выполните: npx degit anthropics/skills/skills/web-artifacts-builder .claude/skills/web-artifacts-builder
  24. 242. Откройте новую сессию Claude Code — навык подхватится сам.