Future Turbo versions


To apply utility classes to elements, it is not enough to use the utility classes themselves. You have to select the Turbo language as well by using the t1 class. There may be other versions introduced in the future, like t2, t3, etc.

Thus, to set the width and height of an element to 16px, you would have to write:

t1 w-16 h-16

The CSS utility classes will be defined like this:

.t1.w-16 { width: 16px; } .t1.h-16 { height: 16px; }

The purpose of language versioning

The most important reason for using the t1 namespace class is to enable the evolution of the language.

The t1 line of the specification is frozen to be backwards compatible. We may add features, in which case you should upgrade to get those features, but we will not introduce breaking changes forcing a rewrite on you. That's what the t2 line is for.

Without the t1 namespace, upon releasing a next version, existing projects would need to be migrated to Turbo v2 or be stuck on the Turbo v1 line. Unfortunately, migration may not be possible on larger codebases. Migration is too expensive (time + money) and the risk is just too high that the user interface will be broken.

To address this issue, all the utility classes have to be used with the additional t1 namespace class, which guarantees that there will be collision with future releases. The next version of the language will use the t2 class and so on. Crucially, migration will not be required as you will be able to use multiple versions of Turbo within the same website / webapp.


Documentation, code samples

The Web is a great place for finding documentation about a language. On the flip side, as the language evolves, it may be hard to figure out what Turbo version is required by a random code snippet.

By using the t1 class, it becomes trivial that the code snippet requires the Turbo CSS v1 compiler. This is also useful when integrating the compiler into your codebase as code snippets can be easily located.



The t1 class is used as a namespace, thus Turbo code can be dropped into any existing project without causing CSS pollution, assuming the t1 class is not used on the project.

For the record, there are 2 more classes which must not be used: the t1-start, t1-all.

(Note: this protects an existing project form side-effects caused by Turbo but not the other way around. A project may contain class definitions which happen to match Turbo utility class names, in which case further isolation is required.)


Finding Turbo code

The t1 class makes it easy to locate Turbo specific code within a codebase, which comes useful when build-time compilation is desired.