Antfu Design
Aplica las convenciones de UnoCSS al estilo antfu con tokens semánticos duales claro/oscuro.
Probado · Funciona
Qué hace
Convenciones de diseño al estilo antfu, ampliadas. Basadas en UnoCSS, con tokens semánticos por clase con modo claro/oscuro dual para interfaces de herramientas y devtools, además de lectura de diseño, anti-slop y pulido de microinteracciones para landing pages y superficies de producto. Úsala al construir o refactorizar cualquier interfaz con UnoCSS.
Informe de la prueba
Instalada de forma literal (git clone + cp, frontmatter YAML válido, los 14 archivos de referencia presentes) y probada en A/B construyendo un panel denso de devtools Vite Cache Inspector con y sin la skill, verificado en modo claro y oscuro. La skill aplicó rasgos genuinos del estilo antfu que el base no tenía: el nombre de archivo en un acento verde contenido (el resaltado de 'módulo activo' de vite-plugin-inspect), el sistema de tokens de opacidad op50/op-fade, el negro casi puro #111 y el relleno de panel a todo lo ancho. El base fue competente y limpio (incluso estructuralmente más rico, con encabezados de columna y un contador en el pie), así que la ventaja de la skill fue un giro visible pero modesto hacia el idioma antfu, no un salto de pulido drástico.
Probado el: 2026-07-12 · Claude Code 2.x (agent harness)
Instalación
git clone https://github.com/antfu/skills cd skills mkdir -p ~/.claude/skills cp -r skills/antfu-design ~/.claude/skills/antfu-design
Comandos y prompts de ejemplo
/antfu-designAplica las convenciones de UnoCSS al estilo antfu con tokens semánticos duales claro/oscuro.
Los skills se activan con peticiones en lenguaje natural, sin comandos que memorizar. Tras instalarlo, prompts como estos lo activan (en inglés):
Refactor this UI to use antfu-style UnoCSS tokensAdd dark mode support using semantic UnoCSS classesPolish this dashboard's micro-interactions and tokens