Part 4—CSS Preprocessing

21 What is CSS preprocessor?

Nowadays, we often craft our styles by using preprocessors syntax. They provides a CSS-like syntax with enhanced features to save our time when building the web.


We may get help from CSS Preprocessors. They enchance the CSS with a couple of handy features. Here are common features that preprocessors provides:

  • variables
  • functions (mixin)
  • nested selectors


For the tools to compile the code into CSS, we need tool. Someone may favour command-line tool and some may favour GUI ones. Here are the GUIs.

And here is the command-line tools.


Codepen also provides both compiled CSS and SCSS in their editor.


What is CSS preprocessor? Copyright © by makzan. All Rights Reserved.

Share This Book

Notice: 2nd edition update is work-in-progress. See update logs for details.