Thesis CSS Preprocessors

The Thesis Skin API contains out-of-the-box support for both the SCSS and LESS CSS preprocessors. 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.

Note: If you elect to use a CSS preprocessor, Thesis will disable Packages in the Skin Editor.