This is a small TailwindCSS alternative based on a <code>css</code> template literal. I was inspired by <a href=“http://styled-components.com/” rel=“ugc”>styled-components</a> and <a href=“https://emotion.sh/docs/introduction” rel=“ugc”>EmotionCSS</a>, but they do not work well with ViteJS and, specifically, Preact. I wanted something more optimized than other CSS-in-JS alternatives that generate CSS at runtime, so I created this ViteJS plugin. The plugin extracts all style snippets, replaces them with classes like <code>css-a1b2c3</code>, and injects all the corresponding styles into a CSS file in place of an <code>@extracted-css</code> directive. This provides a better experience than Tailwind, as you can use all CSS language features without learning new conventions while maintaining a per-component styling approach. This is also more inspectable in the browser’s dev-tools, as snippets are extracted as-is and are not fragmented across thousands of small classes. There is also a <a href=“https://preactjs.com/guide/v10/options/” rel=“ugc”>preact options hook</a> that adds a custom <code>classList</code> attribute, which maps to <code>clsx</code> for easy class composition (similar to VueJS, Svelte, etc.). P.S. I know other frameworks exist, but I have really been enjoying using Preact for frontend development recently. Comments