Download Turbo CSS

 

The simplest way to get started

Add the following script to your site:

The following will happen:

  • the Turbo CSS JavaScript compiler will be added to the page,

    • it will automatically compile all Turbo classes from elements that have the t1 class and populate a <style> tag with the resulting CSS,

    • watch the DOM for changes (via MutationObserver) and recompile if required,

  • add the Turbo CSS base styles to the document head, only affecting elements with the t1 and t1-start classes, plus the entire subtrees of elements with the t1-all class (you don't need this if you add the t1 class to all elements).

  • configure the meta viewport tag.

Usage:

  • add the t1-start class to any subtree-roots that Turbo CSS shall control - most often the html element (this will reset inheriting properties, like the font-size),

  • add the t1 class to every element which you want Turbo CSS to design,

    • alternatively, you can add the t1-all class to any subtree-roots that Turbo CSS has exclusive control over, in which case you don't need to use the t1 class on elements that you don't want to apply any utilities to.

  • add Turbo CSS classes either on the server or in the browser.