web-frontend
Web Frontend
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 lawless-m/claude-skills
vram-gpu-oom
GPU VRAM management patterns for sharing memory across services (Ollama, Whisper, ComfyUI). OOM retry logic, auto-unload on idle, and service signaling protocol.
11rust
Rust development patterns, project setup, CLI/TUI applications, error handling, and system integration
1browserbridge
Real-time browser debugging and interaction via WebSocket bridge server on localhost:3141
1postgresql
PostgreSQL database operations using PgQuery tool for DDL execution, schema management, and query operations
1