modern-css
✓Aplique de forma proactiva al crear sistemas de diseño, bibliotecas de componentes o cualquier aplicación frontend. Activadores en CSS Grid, Subgrid, Flexbox, consultas de contenedor, :has(), @layer, @scope, anidamiento de CSS, @property, @function, if(), oklch, mezcla de colores, claro-oscuro, color relativo, @starting-style, animaciones con desplazamiento, ver transiciones, posicionamiento de ancla, ventana emergente, selección personalizable, visibilidad de contenido, propiedades lógicas, ajuste de texto, tamaño de interpolación, abrazadera, tamaño de campo, CSS moderno, Arquitectura CSS, diseño responsivo, modo oscuro, tematización, tokens de diseño, capas en cascada. Úselo al escribir CSS para cualquier proyecto web, elegir enfoques de diseño, crear componentes responsivos, implementar modo oscuro o temas, crear animaciones o transiciones, diseñar elementos de formulario o modernizar hojas de estilo heredadas. Funciones CSS modernas y mejores prácticas para crear interfaces con CSS nativo puro.
Instalación
SKILL.md
Pure native CSS for building interfaces — no preprocessors, no frameworks.
| CSS Grid, Subgrid, Flexbox | @function, if() (Chrome-only) | | Container Queries (size + style) | Customizable (Chrome-only) | | :has(), :is(), :where() | Scroll-state queries (Chrome-only) | | CSS Nesting, @layer, @scope | sibling-index(), sibling-count() | | @property (typed custom props) | ::scroll-button(), ::scroll-marker |
| oklch(), color-mix(), light-dark() | Typed attr() beyond content | | Relative color syntax | field-sizing: content | | @starting-style, transition-behavior | interpolate-size (Chrome-only) | | Scroll-driven animations | Grid Lanes / masonry (experimental) | | Anchor positioning, Popover API | random() (Safari TP only) |
Aplique de forma proactiva al crear sistemas de diseño, bibliotecas de componentes o cualquier aplicación frontend. Activadores en CSS Grid, Subgrid, Flexbox, consultas de contenedor, :has(), @layer, @scope, anidamiento de CSS, @property, @function, if(), oklch, mezcla de colores, claro-oscuro, color relativo, @starting-style, animaciones con desplazamiento, ver transiciones, posicionamiento de ancla, ventana emergente, selección personalizable, visibilidad de contenido, propiedades lógicas, ajuste de texto, tamaño de interpolación, abrazadera, tamaño de campo, CSS moderno, Arquitectura CSS, diseño responsivo, modo oscuro, tematización, tokens de diseño, capas en cascada. Úselo al escribir CSS para cualquier proyecto web, elegir enfoques de diseño, crear componentes responsivos, implementar modo oscuro o temas, crear animaciones o transiciones, diseñar elementos de formulario o modernizar hojas de estilo heredadas. Funciones CSS modernas y mejores prácticas para crear interfaces con CSS nativo puro. Fuente: ccheney/robust-skills.
Datos (listos para citar)
Campos y comandos estables para citas de IA/búsqueda.
- Comando de instalación
npx skills add https://github.com/ccheney/robust-skills --skill modern-css- Fuente
- ccheney/robust-skills
- Categoría
- </>Desarrollo
- Verificado
- ✓
- Primera vez visto
- 2026-02-17
- Actualizado
- 2026-02-18
Respuestas rápidas
¿Qué es modern-css?
Aplique de forma proactiva al crear sistemas de diseño, bibliotecas de componentes o cualquier aplicación frontend. Activadores en CSS Grid, Subgrid, Flexbox, consultas de contenedor, :has(), @layer, @scope, anidamiento de CSS, @property, @function, if(), oklch, mezcla de colores, claro-oscuro, color relativo, @starting-style, animaciones con desplazamiento, ver transiciones, posicionamiento de ancla, ventana emergente, selección personalizable, visibilidad de contenido, propiedades lógicas, ajuste de texto, tamaño de interpolación, abrazadera, tamaño de campo, CSS moderno, Arquitectura CSS, diseño responsivo, modo oscuro, tematización, tokens de diseño, capas en cascada. Úselo al escribir CSS para cualquier proyecto web, elegir enfoques de diseño, crear componentes responsivos, implementar modo oscuro o temas, crear animaciones o transiciones, diseñar elementos de formulario o modernizar hojas de estilo heredadas. Funciones CSS modernas y mejores prácticas para crear interfaces con CSS nativo puro. Fuente: ccheney/robust-skills.
¿Cómo instalo modern-css?
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/ccheney/robust-skills --skill modern-css 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 o Cursor
¿Dónde está el repositorio de origen?
https://github.com/ccheney/robust-skills
Detalles
- Categoría
- </>Desarrollo
- Fuente
- skills.sh
- Primera vez visto
- 2026-02-17