Sistemas de diseño
Material 3
Implementa Material Design 3 de Google en Compose, Flutter y web.
Qué es
Una guía de Material Design 3 que cubre el namespace de tokens md.sys, más de 30 componentes, maquetación adaptativa, theming y M3 Expressive. Jetpack Compose es el objetivo principal; Flutter y @material/web son secundarios.
>
Por qué importa para el diseño
- Los tokens de color, tipografía, forma y elevación sustituyen los valores hex y de radio escritos a mano.
- Las superficies tonales aportan profundidad en lugar de sombras, acorde a la spec actual de MD3.
- Una auditoría con puntuación califica diez categorías y enumera las correcciones por orden de prioridad.
Qué cubre
- Design token system
- Component quick reference
- Common patterns
- Anti-patterns
- M3 Expressive
- MD3 compliance audit
Cómo instalarlo
Material 3
-
Clona el repositorio.
git clone https://github.com/hamen/material-3-skill -
Señálale a Codex el archivo de la skill.
skills/material-3/SKILL.md -
Luego describe la interfaz que quieres. Codex sigue la skill.
Cómo ejecutarlo con Codex
-
Nombra la plataforma para que Codex elija Compose, Flutter o propiedades personalizadas de CSS.
-
Pide un componente y obtén la variante correcta más el cableado de tokens.
-
Ejecuta la auditoría sobre una URL o archivos fuente para un informe de cumplimiento.
Todos los plugins de esta colección son gratuitos, de código abierto y enlazan a su fuente original real.
Más en la lista codex-design ↗Más plugins de diseño para Codex
Frontend y UI Qué hace gpt-taste Crea landing pages de estilo premiado con movimiento de scroll GSAP y rejillas bento sin huecos. 
Sistemas de diseño Qué hace Stitch Design Taste Escribe un DESIGN.md que orienta a Google Stitch hacia pantallas que no son genéricas. 
Frontend y UI Qué hace image-to-code Primero genera imágenes de diseño, las analiza y luego construye el código frontend correspondiente. 
Frontend y UI Qué hace imagegen-frontend-mobile Genera flujos de pantallas de apps móviles premium como imágenes, no como código. Siguiente paso
Diseña con Open Design, sin montar nada
Instálalo tú mismo, o ejecuta toda una capa de diseño curada alrededor de Codex con Open Design. Trae tu propia key: lo que produzcas es tuyo.