Essential CSS Keywords and Concepts

Core vocabulary for discussing CSS and design problems with precision.

Layout Keywords:

• Flexbox: One-dimensional layout (row or column)
• Grid: Two-dimensional layout (rows and columns)
• Flow layout: Default document flow (block/inline)
• Intrinsic sizing: Content-based dimensions
• Extrinsic sizing: Container-based dimensions

Design System Terms:

• Design tokens: Named design decisions
• Component composition: Building complex UI from simple parts
• Atomic design: Atoms → Molecules → Organisms → Templates → Pages
• Design API: Consistent interface for using design elements

CSS Architecture:

• Specificity: Weight of CSS selectors
• Cascade: Rule priority system
• Inheritance: Properties passed to children
• Logical properties: Direction-agnostic properties (inline-start vs left)

Performance Terms:

• Critical CSS: Above-the-fold styles
• FOUC: Flash of Unstyled Content
• Layout thrashing: Repeated layout calculations

Search Terms: Use these when researching CSS solutions or asking LLMs for help.

Related: CSS Cascade Fundamentals, Design System Fundamentals