I made a Tailwind alternative for Preact

Details

External ID

46576153

Source

HN

Company

—

Product

I made a Tailwind alternative for Preact

Website domain

github.com

Launched

Jan. 11, 2026

Cohort

—

Upvotes

6

Upvotes percentile

0.2549407114624506

Tags

—

Fetched at

Sept. 7, 2026, 9:25 p.m.

Updated at

Sept. 7, 2026, 9:25 p.m.

Description

This is a small TailwindCSS alternative based on a css template literal. I was inspired by styled-components and EmotionCSS, which however do not work well with ViteJS and specifically Preact.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 also turns out to be more inspectable in the browser's dev-tools, as snippets are extracted as-is and are not fragmented across thousands of small classes.I wanted something more optimized than other CSS-in-JS alternatives that generate CSS at runtime, so I created a ViteJS plugin for this. It extracts all style snippets, replaces them with classes like css-a1b2c3, and injects all the corresponding styles into a CSS file in place of an "@extracted-css" directive.There is also a preact options hook that adds a custom "classList" attribute, which maps to clsx for easy class composition (similarly to VueJS, Svelte, etc.).P.S. I know other frameworks exist, but I have really been enjoying using Preact for frontend development lately.

• Source listing
• Website