excatt/skills/artifacts-builder
skills/artifacts-builder/SKILL.md
# Artifacts Builder **Artifacts Builder** is a toolkit for creating sophisticated Claude.ai HTML artifacts using modern frontend technologies. ## Trigger - When user requests complex interactive HTML interfaces - Building React-based applications within Claude - Creating self-contained bundled artifacts - Developing UI with Tailwind CSS and shadcn/ui ## Capabilities The suite leverages "React 18 + TypeScript + Vite + Parcel (bundling) + Tailwind CSS + shadcn/ui" to build multi-component inte
$ install --global
skillsauthnpx skillsauth add excatt/superclaude-plusplus skills/artifacts-builderInstall this skill globally with one command. Works with Claude Code, Cursor, and Windsurf.
Security Scan Results
3 of 9 scanners reported clean
Some scanners were skipped, did not run, or reported a non-clean status. Review each row below.
3
Scanners Passed
9
Scanners in report
Clean
TrivyContainer and dependency vulnerability scanner
95%
Clean
SemgrepStatic code analysis for vulnerabilities
95%
Clean
mcp-scan (Snyk)Model Context Protocol security validation
95%
Skipped
Snyk (dep)Open source security scanning
50%
Skipped
Socket.devSupply chain security analysis
50%
Skipped
VirusTotalMulti-engine malware detection
50%
Skipped
CrowdStrikeAdvanced threat intelligence
50%
Skipped
OSV-ScannerOpen Source Vulnerability database check
50%
Skipped
OWASP Dep-Check
50%
Last scanned: Apr 23, 2026, 4:44 PM248.3s1 file scanned
SKILL.md
Artifacts Builder
Artifacts Builder is a toolkit for creating sophisticated Claude.ai HTML artifacts using modern frontend technologies.
Trigger
- When user requests complex interactive HTML interfaces
- Building React-based applications within Claude
- Creating self-contained bundled artifacts
- Developing UI with Tailwind CSS and shadcn/ui
Capabilities
The suite leverages "React 18 + TypeScript + Vite + Parcel (bundling) + Tailwind CSS + shadcn/ui" to build multi-component interfaces requiring state management or routing capabilities.
Main Workflow
- Initialize: Frontend repository via
scripts/init-artifact.sh - Develop: Code editing with React and TypeScript
- Bundle: Create single HTML file using
scripts/bundle-artifact.sh - Present: Show artifact to user
- Test: Optionally test the result
Automatic Setup
The initialization script automatically configures:
- React and TypeScript development environment
- Tailwind CSS with shadcn/ui theming
- Path aliases and component libraries
- Parcel bundler with appropriate configurations
- Node 18+ compatibility
Output Format
Creates self-contained bundle.html file with:
- All JavaScript embedded
- CSS fully compiled
- Dependencies bundled
- Standalone and shareable
Design Principles
- Avoid excessive centered layouts
- Minimize purple gradients
- Reduce uniform rounded corners
- Consider font choices beyond Inter
Use When
- Building interactive dashboards
- Creating form-heavy applications
- Developing state-managed components
- Need cross-browser compatibility
- Sharing self-contained web applications
Related Skills
excatt/grill-with-docs
testing
VerifiedTrustedCommunity
사용자 계획을 기존 도메인 모델에 대해 stress-test하는 인터뷰 세션. 용어를 날카롭게 다듬고, 결정이 굳어질 때마다 CONTEXT.md(도메인 어휘 사전)와 ADR을 인라인으로 갱신한다. 새 기능 요구사항 탐색은 `/brainstorm`을, 기존 도메인 모델·용어와의 정합성 점검은 이 스킬을 사용한다.
13SKILL.mdUpdated May 21, 2026
excatt/skills/xlsx
development
VerifiedTrustedCommunity
# Excel (XLSX) Spreadsheet Skill Claude Code supports comprehensive spreadsheet operations through the **xlsx** skill, enabling creation, editing, and analysis of Excel files (.xlsx, .xlsm, .csv, .tsv). ## Trigger - When user needs Excel spreadsheet creation or editing - Financial modeling or data analysis required - Spreadsheet formulas and calculations needed - Data import from CSV/TSV files ## Core Capabilities **Primary functions include:** - Creating new spreadsheets with formulas and f
13SKILL.mdUpdated May 15, 2026
excatt/workflow
tools
VerifiedTrustedCommunity
Generate structured implementation workflows from PRDs and feature requirements
13SKILL.mdUpdated May 15, 2026
excatt/websocket
development
VerifiedTrustedCommunity
실시간 통신 설계 가이드를 실행합니다.
13SKILL.mdUpdated May 15, 2026