Extending CSS.
WHAT THEY PROVIDE
Variables Nesting Mixins and functions Splitting into files, combined at build Loops and conditions
WHAT THE PLATFORM NOW PROVIDES NATIVELY
Custom properties, which are variables that work at runtime Nesting, in current browsers
WHAT THAT MEANS
Less of a preprocessor is required than previously.
WHAT THEY STILL PROVIDE
Mixins Functions and computation at build time File organisation Loops for generating repetitive rules
WHAT TO PREFER FOR THEMING
Custom properties.
WHY
They can change at runtime, which build-time variables cannot.
WHAT TO BE CAREFUL WITH
Nesting deeply, which produces high specificity invisibly Mixins generating large amounts of duplicated output Complex logic in stylesheets
WHAT TO LIMIT NESTING TO
A small number of levels.
WHAT TO ORGANISE
Files by purpose: settings, base, layout, components, utilities.
WHAT TO CHECK
The size of the compiled output.