interactive-component-creator
Web Artifacts Builder
To build powerful frontend claude.ai artifacts, follow these steps:
- Initialize the frontend repo using
scripts/init-artifact.sh - Develop your artifact by editing the generated code
- Bundle all code into a single HTML file using
scripts/bundle-artifact.sh - Display artifact to user
- (Optional) Test the artifact
Stack: React 18 + TypeScript + Vite + Parcel (bundling) + Tailwind CSS + shadcn/ui
Design & Style Guidelines
VERY IMPORTANT: To avoid what is often referred to as "AI slop", avoid using excessive centered layouts, purple gradients, uniform rounded corners, and Inter font.
Quick Start
Step 1: Initialize Project
More from qodex-ai/ai-agent-skills
word-document-processor
Comprehensive word document processing with full format support. Handles creation, editing, formatting preservation, tracked changes, and metadata management.
2.4Kmulti-agent-orchestration
Design and coordinate multi-agent systems where specialized agents work together to solve complex problems. Covers agent communication, task delegation, workflow orchestration, and result aggregation. Use when building coordinated agent teams, complex workflows, or systems requiring specialized expertise across domains.
1.4Kfinancial-analysis-agent
Create agents for financial analysis, investment research, and portfolio management. Covers financial data processing, risk analysis, and recommendation generation. Use when building investment analysis tools, robo-advisors, portfolio trackers, or financial intelligence systems.
875legal-document-analyzer
Build agents for legal document analysis, contract review, and compliance checking. Handles document parsing, risk identification, and legal research. Use when creating contract analysis tools, legal research assistants, compliance checkers, or document review systems.
559ecommerce-platform-specialist
Provide expert guidance on Shopify e-commerce platform. Advises on store setup, products, customization, and optimization.
514spreadsheet-processor
Process and manipulate spreadsheet documents. Creates, edits, analyzes, and transforms Excel files with formula and formatting support.
274