Сложные веб-артефакты для Claude

web-artifacts-builder

Официальный навык Anthropic. Для многокомпонентных артефактов с состоянием и маршрутами — не для простых одностраничных.

Как установить Открыть на GitHub

Что делает

Чем навык помогает в работе.

Создаёт проект на React и TypeScript
Подключает Tailwind и компоненты shadcn/ui
Собирает всё в один HTML-файл
Подходит для артефактов со состоянием и маршрутами

Примеры задач

Опишите задачу — и запустите навык в чате.

Собери артефакт-дашборд с вкладками и таблицами для claude.ai.

Сделай многостраничный веб-артефакт с навигацией.

Как установить

Одна команда в терминале — навык добавится вашему агенту.

Терминал

npx skills add https://github.com/anthropics/skills --skill web-artifacts-builder

Понадобится Node.js. Навык работает в Claude Code и других агентах, которые читают скиллы из папки проекта.

Безопасность

Скилл — это инструкции, которые выполняет ваш агент. Ставьте навыки из репозиториев, которым доверяете, и при желании загляните в файл SKILL.md перед установкой.

Другие скиллы anthropics/skills

Создание интерфейсов, frontend-design

frontend-design · anthropics

Создаёт сайты и интерфейсы с продуманным видом: подбирает цвета, шрифты и расположение блоков, а затем пишет готовый код.

ДизайнОфициальный844,1 тыс

Создание и доводка навыков, skill-creator

skill-creator · anthropics

Помогает создать новый навык для ИИ-агента с нуля или улучшить готовый: пишет черновик, придумывает проверки, прогоняет их и правит навык по результатам.

АгентОфициальный369,4 тыс

Работа с презентациями PowerPoint, pptx

pptx · anthropics

Создаёт, редактирует и читает презентации PowerPoint: собирает слайды из данных, правит существующие файлы и вытаскивает из них текст и заметки.

ДокументыОфициальный213 тыс