Loading...
Loading...
Found 151 Skills
Create new Agent Skills from templates with best-practice structure, pre-populated SKILL.md, and optional scripts/assets directories.
Build high-quality visual Web artifacts using HTML/CSS/JavaScript/React — web pages, landing pages, dashboards, interactive prototypes, HTML slide decks, animated demos, UI mockups, data visualizations, and more. Use this skill whenever the user's request involves a visual, interactive, or front-end deliverable, including: - Creating web pages, landing pages, dashboards, marketing pages - Building interactive prototypes or UI mockups (with device frames) - Building HTML slide decks / presentations - Creating CSS/JS animations or timeline-driven animated demos - Turning design mockups, screenshots, or PRDs into interactive implementations - Data visualization (Chart.js / D3, etc.) - Design system / UI Kit exploration Even if the user doesn't explicitly say "HTML" or "web page," this skill applies whenever the intent is to produce something visual, interactive, or presentational. Not applicable: pure back-end logic, CLI tools, data-processing scripts, non-visual code tasks, command-line debugging.
Backend 없이 Mock 데이터 기반 프로토타입 UI를 생성·검증하는 기획 구체화 산출물 스킬. Vue 3 + TypeScript + NuxtUI v4. 별도 ui-proto 저장소(예: peach-ui-proto-backoffice)의 src/modules-task 폴더에 태스크별 화면을 누적한다. "프로토타입 만들어줘", "Mock 화면", "proto UI", "기획 화면 빠르게", "ui-proto 작업", "기획자 검토용 화면", "태스크 폴더 추가", "팀 ui-proto" 키워드로 트리거. 기획자가 직접 작업하는 화면 기획 + 현업 검토용 산출물 스킬이며, 개발용 Spec은 후속 peach-gen-spec이 생성한다. 실제 API 연동이 필요하면 peach-gen-ui를 사용한다.
DESIGN-CATALOG
Guide human-centered design processes using empathy-driven methodologies. Use when the user says "lets run design thinking" or "I want to apply design thinking"
Aura - Senior UI/UX Design Architect with 12+ years creating premium digital experiences. Use when designing landing pages, dashboards, mobile apps, design systems, component libraries, or brand-aligned UI. Specializes in React/Tailwind/Framer Motion prototypes, responsive design, micro-interactions, and discovery-first design process.
Transformez une image 2D en modèle 3D animé prêt pour le web ou le jeu en moins de 30 minutes, en utilisant le workflow Dilum Sanjaya (Hunyuan3D + Mixamo). Use when: **Créer un personnage 3D pour un site web** - Mascotte, avatar, illustration interactive; **Prototyper un asset de jeu** - Character design, props, environnements; **Produire du contenu marketing 3D** - Produits rotatifs, personnages animés; **Convertir des illustrations existantes** - Logo, mascotte, character design → 3D; **Tes...
Create multiple UI design mockups in parallel. Use when asked to create mockups, wireframes, or design variations for a feature. Creates HTML files using Mantine v7 + Tailwind following Civitai's design system.
网格背景 + marker 笔触 + 多 tab + sticky note + scribble 图表
Direct-invocation specialist for low-fidelity, self-contained HTML wireframes that test information hierarchy, content, navigation, task flow, and responsive structure before visual design. Use when the user explicitly invokes html-wireframe or the broad html skill routes a wireframe request here. Do not activate independently from a general request. Do not use for polished mockups or production-like interaction; use html-prototype for those.
Design user interactions, flows, and interface behaviors. Use for wireframes, prototypes, micro-interactions, user flows, state machines, affordance design, and usability reviews. Covers IxD principles, Nielsen heuristics, Fitts's Law, Hick's Law, and emerging paradigms (spatial, conversational, gesture-based interfaces). Keywords: IxD, wireframe, prototype, user flow, micro-interaction, UI state diagram, screen flow, clickable prototype, interaction pattern.
Design user-centric interfaces for web applications. Creates wireframes, visual designs, and interactive prototypes with usability focus.