/01 — Agent skills
AI skills & specializations
The skills my AI agents can reach for — filter by category to explore what each one does.
frontend-design
Guidance for distinctive, intentional visual design when building new UI or reshaping existing interfaces. Helps with aesthetic direction, layout, typography, and color systems.
web-artifacts-builder
Suite of tools for creating elaborate, multi-component HTML artifacts using modern frontend web technologies (React, Tailwind, TypeScript, shadcn/ui).
frontend-ui-engineering
Component architecture, design systems, state management, responsive design, and WCAG 2.1 AA accessibility for building or modifying user-facing interfaces.
theme-factory
Toolkit for styling artifacts (slides, docs, HTML landing pages) with 10+ built-in themes. Apply consistent theming across all output formats.
canvas-design
Create beautiful visual art in documents using design philosophy. For creating aesthetically compelling layouts, diagrams, and visual elements.
obsidian-skills
Agent skills for Obsidian — teach your AI agent to use Obsidian CLI, Markdown, Bases, JSON Canvas, and open format note-taking.
marketingskills
Marketing skills for Claude Code and AI agents. CRO, copywriting, SEO, analytics, and growth engineering for AI-powered marketing workflows.
api-and-interface-design
Guides stable API and interface design. Use when designing APIs, module boundaries, or any public interface.
algorithmic-art
Creating algorithmic art using p5.js with seeded randomness and interactive parameter exploration for generative art.
brand-guidelines
Applies official brand colors and typography to artifacts for consistent look-and-feel across all outputs.
idea-refine
Refines raw ideas into sharp, actionable concepts through structured divergent and convergent thinking.
composition-patterns
React composition patterns that scale. Compound components, state lifting, and internal composition to avoid boolean prop proliferation.
react-best-practices
React and Next.js performance optimization guidelines from Vercel Engineering. 40+ rules across 8 categories.
react-native-guidelines
React Native best practices for AI agents. Performance, architecture, animations, and platform-specific patterns.
react-view-transitions
Implement smooth, native-feeling animations using Reacts View Transition API with Next.js integration.
web-design-guidelines
Review UI code for compliance with web interface best practices. 100+ rules covering accessibility, performance, and UX.
guizang-ppt-skill
AI agent skill for polished HTML slide decks with editorial and Swiss layouts, image prompts, and presentation design.
react-native-skills
React Native and Expo best practices for building performant mobile apps. Optimized list performance, animations, native modules, and platform-specific patterns.
frontend-slides
Create beautiful slides on the web using a coding agent's frontend skills. Design-driven slide creation with modern HTML/CSS, typography systems, and presentation layouts.
claude-api
Guidance for effectively using the Claude API including message structure, tool use, streaming, system prompts, and best practices for production integration.
docx
Create professional Word documents (.docx) with proper formatting, tables, images, styles, headers, footers, and section breaks using AI agent document generation.
Generate PDF documents with proper layout, typography, tables, embedded images, and accessibility features using agent-driven document creation workflows.
pptx
Create polished PowerPoint presentations with slides, charts, tables, animations, speaker notes, and professional formatting through agent-driven slide deck generation.
slack-gif-creator
Create animated GIFs optimized for Slack integration. Generate custom GIF responses, reactions, memes, and visual content for team communication and reactions.