layout-system

SKILL.md

Layout is the skeleton of your interface. It determines how content is organized, how users navigate, and how the experience adapts across devices. A well-designed layout system is invisible—users don't notice it because it works so well.

This skill teaches you to think about layout systematically, using modern CSS techniques (Flexbox, Grid, Container Queries) and a mobile-first approach that ensures your product works beautifully everywhere.

The mobile-first approach is not just about making things smaller on mobile. It's a fundamental shift in thinking: start with the simplest, most constrained context (mobile), then progressively enhance for larger screens.

Maîtrisez la conception de mise en page réactive à l'aide de CSS modernes (Flexbox, Grid), d'une approche axée sur le mobile et de stratégies de points d'arrêt. Créez des mises en page qui s'adaptent parfaitement à tous les appareils tout en conservant l'accessibilité et les performances. Inclut des requêtes de conteneur, des proportions et des modèles réactifs avancés. Source : sanky369/vibe-building-skills.

Voir l'original