Why design systems use Sass or PostCSS

WHAT THIS TESTS The interviewer checks whether you know what preprocessors and PostCSS actually add beyond plain CSS, and why those features matter specifically for a large, maintainable design system.

A GOOD ANSWER COVERS Sass is a preprocessor: you write an extended syntax that compiles to CSS. Its key features are variables for tokens like colors and spacing, nesting that mirrors component structure, mixins that package reusable groups of declarations and accept arguments, functions for computed values, partials and import or use for splitting code into maintainable files, and placeholder selectors with extend for shared rules. These let a design system define tokens once and reuse patterns, keeping things DRY and consistent. PostCSS is different: it is a tool that parses CSS into an abstract syntax tree and runs plugins to transform it. Common plugins include autoprefixer, which adds vendor prefixes based on a browserslist, plugins that polyfill modern syntax, linting, and minification. PostCSS integrates the styling into the build pipeline.

COMMON WRONG ANSWERS Claiming native CSS custom properties make preprocessors fully obsolete is wrong; custom properties replace some variables but not mixins, loops, functions, or build-time transforms. Confusing Sass and PostCSS as the same kind of tool misses that one is a language and the other a transformer. Saying they exist only for nesting overlooks the bigger maintainability story.

LIKELY FOLLOW-UPS Where do native custom properties beat Sass variables, namely runtime theming? When would you use both Sass and PostCSS together? What is the difference between Sass variables and CSS variables in terms of scope and runtime? How does autoprefixer decide what to add?

ONE CONCRETE EXAMPLE A spacing scale defined as a Sass map plus a mixin lets every component apply consistent padding from one source, while autoprefixer in PostCSS quietly adds the prefixes needed for a flex layout, so authors write clean modern CSS and the build emits broadly compatible output.