Panda CSS Utopia

I'm a responsive typography nerd. The Utopia methodology is one of my favourite approaches to fluid design — instead of jumping between discrete breakpoints, your typography and spacing scales smoothly across viewport sizes using CSS clamp.

There was already a Tailwind implementation, but I'm a big fan of Panda CSS. It brings together everything I think is important in writing styles: type safety, flexibility, and optimised output. It gives you a toolkit that lets you move fluidly between creating strict design systems and just throwing out styles when you need to.

So I built a Panda CSS preset that uses the utopia-core library. Now I can quickly add modular scales to any project.