The options.
PLAIN STYLESHEETS
Simple, no build step, requires discipline and a naming convention.
PREPROCESSORS
Variables, nesting and functions, compiled to stylesheets.
UTILITY FRAMEWORKS
Composing styles from small single-purpose classes in the markup.
COMPONENT FRAMEWORKS
Prebuilt components with their own styling.
STYLES IN JAVASCRIPT
Styles defined alongside components, scoped automatically.
SCOPED COMPONENT STYLES
Provided natively by some frameworks.
WHAT TO WEIGH
Team familiarity Project size Whether a design system exists Build tooling already in place Runtime cost
WHAT MATTERS MOST AT SCALE
Whether styles can be found, understood and removed safely.
WHY THAT LAST ONE
Unused styles accumulate, and nobody dares delete what they cannot trace.
WHAT EVERY APPROACH NEEDS REGARDLESS
Defined values for colour, spacing and type A convention Discipline about specificity
WHAT TO AVOID
Mixing several approaches without a rule about which applies where.
