CSS Best Practices
This skill provides a set of rules and best practices for writing modern, performant, and maintainable CSS. It focuses on stability, modern layout engines, and user-centric accessibility.
This document is designed for AI agents and LLMs (but not limited to) to follow when creating/generating, debugging and maintaining CSS in any format or using any CSS framework, tool and preprocessor in any kind of web project.
Core Rules
- Layout Stability
- Maintainability & Cascade
- Container Queries
- Logical Properties
- Performance & Animation
- Accessibility
Usage
Activate this skill when generating new CSS files, refactoring legacy styles, or debugging UI performance issues.
Read individual reference files for detailed explanations and code examples:
references/layout-stability.md
references/specificity-cascade.md
references/container-queries.md
Each reference file contains:
- Title and basic description/context
- Correct code example with explanation
- Optionally incorrect code example with explanation
- Brief explanation of why it matters