El instalador de skills de desarrollo web para OpenCode.
agent-skill instala con un solo comando los mejores skills especializados en desarrollo web directamente en OpenCode. Los skills le enseñan a OpenCode buenas prácticas y patrones de cada tecnología para que te dé mejores respuestas desde el primer prompt.
Un skill es un archivo que le enseña a OpenCode buenas prácticas y patrones específicos de una tecnología. Cuando escribes tu primer prompt, OpenCode lee automáticamente los skills instalados y los usa para darte la mejor respuesta posible según las tecnologías con las que estás trabajando.
Tienes dos formas de usar agent-skill:
npx descarga y ejecuta la herramienta en el momento sin instalar nada en tu PC. Es la forma más rápida de empezar:
npx @rigokndev/agent-skill install --allSi prefieres tener el comando agent-skill siempre disponible en tu terminal sin usar npx, instálalo globalmente una sola vez:
npm install -g @rigokndev/agent-skillA partir de ese momento puedes usar el comando directamente:
agent-skill install --all# Instalar todos los skills de una vez (recomendado)
npx @rigokndev/agent-skill install --all
# Instalar un skill concreto
npx @rigokndev/agent-skill install <nombre>
# Ver todos los skills disponibles
npx @rigokndev/agent-skill list
# Ver los skills que tienes instalados
npx @rigokndev/agent-skill installed
# Ver información detallada de un skill
npx @rigokndev/agent-skill info <nombre>
# Eliminar un skill instalado
npx @rigokndev/agent-skill remove <nombre>
# Mostrar ayuda
npx @rigokndev/agent-skill --helpTodos los skills son oficiales, creados y mantenidos por sus autores originales. Se descargan siempre en su versión más reciente directamente desde sus repositorios oficiales.
| Nombre | Descripción | Autor |
|---|---|---|
frontend-design |
Interfaces frontend de producción: diseño distintivo, tipografía y animaciones | Anthropic |
react-best-practices |
Optimización React y Next.js: rendimiento, bundle size y re-renders | Vercel |
web-design-guidelines |
Auditoría UI: accesibilidad, formularios, animaciones, dark mode y UX | Vercel |
composition-patterns |
Patrones de composición React: compound components y lifting state | Vercel |
next-best-practices |
Next.js App Router: Server Components, caching y streaming | Vercel |
typescript-advanced-types |
Tipos avanzados TypeScript: genéricos, mapped types y conditional types | wshobson |
tailwind-design-system |
Sistema de diseño con Tailwind CSS: tokens y componentes consistentes | wshobson |
api-design-principles |
Diseño de APIs REST y GraphQL: naming, versionado y buenas prácticas | wshobson |
nodejs-backend-patterns |
Patrones backend Node.js: autenticación, manejo de errores y seguridad | wshobson |
supabase-postgres-best-practices |
Supabase y PostgreSQL: RLS, queries eficientes y autenticación | Supabase |
playwright-best-practices |
Testing end-to-end con Playwright: selectores, assertions y CI/CD | currents-dev |
MIT