Supercharging OpenCode · 85 skills · 15 categories
A library of 85 specialized skills covering design, engineering, infrastructure, and process. Each one teaches the theory behind its decisions, so your AI assistant makes choices it can defend, not defaults it can replicate.
AI assistants produce working code. But without domain knowledge, every decision defaults to the most common pattern. Those convergent defaults compound. The result looks like every other AI output: functional, but indistinguishable.
specialized skills covering design, engineering,
infrastructure, and process: each with theory-backed reasoning
What happens without systematic skills
From establishing purpose before choosing colors, to deploying with rollback strategies. Each category is a domain of expertise; each skill within it is a repeatable practice.
9 skills that prevent AI-default design. Purpose, composition, proportions, color science, editorial structure, interaction states, premium motion, auditing, and stripping AI tells. This is the layer most AI tools skip entirely, and the one that makes the biggest difference.
ui/ux
Interface & user experience
8 skills
End-to-end page design, UX patterns, interaction design, responsive layout, landing pages, accessibility, content design, and visual QA.
motion
Animation & interaction
4 skills
Micro-interactions, animation choreography, motion systems, and premium spring-physics motion: purposeful movement, not decoration.
visual
Visual assets & illustration
3 skills
Icon systems, illustration direction, and data visualization: visual content with cohesive style.
systems
Design systems & tokens
3 skills
Design tokens, component libraries, design specs: scaling design decisions across teams and platforms.
frontend
Component architecture
6 skills
React, Next.js, component composition, CSS styling, state management, and mobile development.
typescript
Type architecture & safety
3 skills
TypeScript type design, type safety enforcement, and Python: languages with systematic type patterns.
api
API & backend
5 skills
REST and GraphQL API design, Node.js backends, error handling, API documentation, and webhooks.
data
Data & databases
5 skills
Schema design, validation, database integration, safe migrations, and SQL optimization.
integration
Feature services
11 skills
Auth, payments, email, file uploads, search, real-time, caching, AI integration, Firebase, webhooks, and internationalization.
infra
Infrastructure & DevOps
6 skills
Docker, CI/CD, deployment, infrastructure as code, environments, and monitoring.
vcs
Version control & release
6 skills
Git commits, branching strategy, PR workflows, code review, changelogs, and release management.
quality
Quality & performance
8 skills
Testing strategy, writing tests, performance optimization, debugging, troubleshooting, security audits, refactoring, and dependency migration.
setup
Project setup
4 skills
Project initialization, tooling configuration, onboarding docs, and feature planning.
seo
SEO & visual QA
2 skills
Next.js SEO implementation and pixel-perfect visual review: shipping quality, not just shipping.
The theory behind every recommendation.
Purpose, medium, and aesthetics must reinforce each other. The Pantheon’s coffers exist because the dome needed them. They’re also beautiful. Technology constraints are design opportunities.
Garamond is timeless in print but blurs on screen. Medium matters. The squint test, the n-test for font pairing, max two families, no fake bold, smart quotes.
Dimensions should relate through intentional ratios (2:3, 3:4, golden), not arbitrary pixel values. Tschichold’s method derives margins from the page itself.
Dominance, similarity, rhythm, texture, direction, contrast. One element commands attention. The eye is guided, not scattered. Not everything gets a card.
Mood drives hue. Hue drives scheme. Color wheel relationships (analogous, complementary, triadic). Hue-shifted shadows for depth. Colorblind-safe with redundant cues.
Remove an animation. Did you lose information? If not, it was decorative. 100ms micro, 300ms standard, 500ms complex. Ease-out for entries. Respect reduced-motion.
Eight states every element needs: default, hover, focus, active, disabled, loading, error, success. 44×44px touch targets. Focus-visible. No placeholder-only labels.
“To truly be adept at designing something, you have to understand how it works. Otherwise, you aren’t designing. You’re creating a veneer. You’re drawing ponies.” (David Kadavy)
All 85 skills, organized by category.