Thesis CSS Preprocessors

The Thesis Skin API contains out-of-the-box support for both the SCSS and LESS CSS preprocessors.

Even better, you don’t have to install any files or set anything up—simply tell Thesis which CSS preprocessor you want your Skin to use via the $functionality property, and BOOM.

If you use SCSS, make sure your SCSS variable names do not conflict with your Thesis CSS Variable names. Thesis allows you to use both types of Variable references at the same time so you can incorporate Design Options and CSS Variable modification while still using SCSS.

The power here is incredible; if you’re accustomed to using SCSS or LESS, using either one with Thesis will blow you away.

Usage Note: If your Skin uses a CSS preprocessor, Thesis will disable Packages (which are deprecated anyway) in the Skin Editor.