ws_scss

ws_scss compiles SCSS directly into CSS within TYPO3—without a separate Node.js build chain. Modified partials are automatically recompiled and cached on a per-file basis.

Examples from this demo: The Site Package template includes about 246 SCSS source files (entry point base-layout.scss plus Bootstrap partials). ws_scss 14.0.5 compiles them on the server into /typo3temp/assets/css/template/main.css —this file is loaded in the header of every page, including this one. The color schemes for the demo widget (Light / Dark / Contrast) come from _variables-dark.scss or _variables-contrast-high.scss.

Note: ws_scss is a build tool for the backend and deployment and does not have its own content element. It does not generate a frontend element, but rather the CSS used to render the entire demo—so the “Demo” on this page is the compiled stylesheet itself.