Thesys generative ui
Skill secondsky/claude-skills/plugins/thesys-generative-ui/skills/thesys-generative-ui
Production-ready skills for Claude Code CLI - Cloudflare, React, Tailwind v4, and AI integrations
npx -y skills add secondsky/claude-skills --skill thesys-generative-uiAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
What its author says it does
Copied from the file, not written here
> Generate, modify, and style React components from natural language using the Thesys SDK. Guides schema-driven UI generation, theme customisation, tool calling integration, and deployment to Vite, Next.js, or Cloudflare Workers. Use when the user says "generate UI", "create a component", "build an interface", "Thesys", "generative UI", or asks to turn a description into a React component.
The file declares its own license as MIT. That is the author’s claim about this one file, and it is not the same thing as the license GitHub reports for the repository, which is listed with the other numbers below.
SKILL.md
2.4 KB, 499 tokens by cl100k_base, as published. Nobody here has run it
Thesys Generative UI
Last Updated: 2025-11-10
Quick Start
import { generateUI } from 'thesys';
const ui = await generateUI({
prompt: 'Create a user profile card with avatar, name, and email',
schema: {
type: 'component',
props: ['name', 'email', 'avatar']
}
});
export default function Profile() {
return <div>{ui}</div>;
}
Core Features
- Natural Language: Describe UI in plain English
- Schema-Driven: Type-safe component generation
- React Components: Generate production-ready components
- AI-Powered: Uses LLMs for intelligent design
Example
const form = await generateUI({
prompt: 'Create a contact form with name, email, and message fields',
theme: 'modern'
});
Resources
Core Documentation
references/what-is-thesys.md- What is TheSys C1, success metrics, getting startedreferences/use-cases-examples.md- When to use, 12 errors prevented, all templates catalogreferences/tool-calling.md- Complete tool calling guide with Zod schemasreferences/integration-guide.md- Complete setup for Vite, Next.js, Cloudflare Workers
Additional References
references/component-api.md- Complete component prop referencereferences/ai-provider-setup.md- OpenAI, Anthropic, Cloudflare Workers AI setupreferences/tool-calling-guide.md- Tool calling patternsreferences/theme-customization.md- Theme system deep divereferences/common-errors.md- Expanded error catalog
Templates (15+ files)
- Vite + React:
basic-chat.tsx,custom-component.tsx,tool-calling.tsx,theme-dark-mode.tsx - Next.js:
app/page.tsx,app/api/chat/route.ts,tool-calling-route.ts - Cloudflare Workers:
worker-backend.ts,frontend-setup.tsx - Utilities:
theme-config.ts,tool-schemas.ts,streaming-utils.ts
Official Docs: https://docs.thesys.dev | Playground: https://console.thesys.dev/playground
What ships with it: 30 files
166.1 KB alongside SKILL.md, 10 of them executable
references/
- ai-provider-setup.md5.3 KB
- common-errors.md11.8 KB
- component-api.md1.5 KB
- error-catalog.md269 B
- integration-guide.md39.5 KB
- tool-calling.md5.5 KB
- use-cases-examples.md3.6 KB
- what-is-thesys.md1.8 KB
scripts/
- check-versions.shruns2.1 KB
- install-dependencies.shruns1.8 KB
templates/
- basic-usage.tsx255 B
- cloudflare-workers/frontend-setup.tsx4.8 KB
- cloudflare-workers/worker-backend.tsruns6.3 KB
- cloudflare-workers/wrangler.jsonc2.5 KB
- nextjs/api-chat-route.tsruns4.5 KB
- nextjs/app-page.tsx3.3 KB
- nextjs/package.json1.1 KB
- nextjs/tool-calling-route.tsruns8.9 KB
- python-backend/fastapi-chat.pyruns3.0 KB
- python-backend/flask-chat.pyruns2.8 KB
- python-backend/README.md5.2 KB
- python-backend/requirements.txt379 B
- shared/streaming-utils.tsruns9.6 KB
- shared/theme-config.tsruns7.3 KB
- shared/tool-schemas.tsruns10.0 KB
- vite-react/basic-chat.tsx3.3 KB
- vite-react/custom-component.tsx6.0 KB
- vite-react/package.json1.1 KB
- vite-react/theme-dark-mode.tsx5.4 KB
- vite-react/tool-calling.tsx7.3 KB