Utopia SCSS Library

Utopia — the extremely handy fluid type and space tool — now has an SCSS (Sass) library which looks great.

I don’t really use Sass anymore, but a lot of people do. Rightly so: it’s great!

I’ll tell you what else is great: Utopia. I’m somewhat of a super fan, so anything Trys and James add to the project is immediately welcomed by me. I think this particular feature is a great addition though because it gives SCSS-based codebases that little bit of extra maintainability.

The way I use Utopia is I stole the calculation off Trys (with permission 😅) and used it in a little node script that sits in the codebase. It means that the type scale can be updated via design tokens without having to go back to the Utopia site to get a new set of Custom Properties. It’s nice that Sass users will get this sorta thing now.

The Utopia team have also released a JS-based core system to use in your tooling of choice too.

Check it out