Diseño atómico de Brad Frost para jerarquía de componentes de interfaz de usuario: átomos, moléculas, organismos, plantillas. Actívelo al crear interfaces de usuario, crear sistemas de diseño, organizar componentes o estructurar código de interfaz. Se aplica a cualquier marco de interfaz de usuario (React, Vue, SwiftUI, etc.).
Instala rápidamente el skill de IA atomic-design en tu entorno de desarrollo mediante línea de comandos
Fuente: jwilger/agent-skills.
Value: Simplicity and communication. Building UI from small, named, composable pieces makes the interface understandable to everyone on the team and prevents the complexity that comes from monolithic components.
Teaches how to organize UI components into a hierarchy of increasing complexity: atoms, molecules, organisms, and templates. Each level has clear responsibilities and composition rules. The outcome is a component system where every piece is reusable, testable in isolation, and named in a shared vocabulary.
Start with the smallest reusable elements and compose upward. Never skip a level.
Diseño atómico de Brad Frost para jerarquía de componentes de interfaz de usuario: átomos, moléculas, organismos, plantillas. Actívelo al crear interfaces de usuario, crear sistemas de diseño, organizar componentes o estructurar código de interfaz. Se aplica a cualquier marco de interfaz de usuario (React, Vue, SwiftUI, etc.). Fuente: jwilger/agent-skills.
Campos y comandos estables para citas de IA/búsqueda.
npx skills add https://github.com/jwilger/agent-skills --skill atomic-designDiseño atómico de Brad Frost para jerarquía de componentes de interfaz de usuario: átomos, moléculas, organismos, plantillas. Actívelo al crear interfaces de usuario, crear sistemas de diseño, organizar componentes o estructurar código de interfaz. Se aplica a cualquier marco de interfaz de usuario (React, Vue, SwiftUI, etc.). Fuente: jwilger/agent-skills.
Abre tu terminal o herramienta de línea de comandos (Terminal, iTerm, Windows Terminal, etc.) Copia y ejecuta este comando: npx skills add https://github.com/jwilger/agent-skills --skill atomic-design Una vez instalado, el skill se configurará automáticamente en tu entorno de programación con IA y estará listo para usar en Claude Code, Cursor u OpenClaw
https://github.com/jwilger/agent-skills