I Built My Own CSS Framework in Vanilla JS (and published it to npm)
I built TeaWind CSS — a utility-first CSS engine that runs entirely in the browser with zero dependencies and zero build steps.
Instead of writing CSS, you write chai- classes directly in your HTML. TeaWind scans the DOM, converts them to inline styles, and then removes every utility class — leaving your markup completely clean.
chai-p-24 → padding: 24px
chai-rounded-2xl → border-radius: 16px
chai-flex chai-items-center → you get it
What's under the hood:
→ Map() cache for ~1ms initialization
→ MutationObserver so it works with React automatically
→ brew() export for manual control
→ Built-in light/dark color palette
→ Self-cleaning DOM — zero utility classes survive after parsing
Links:
📦 npm → https://npmjs.com/package/teawindcss
🔗 GitHub → https://github.com/PreetMax85/teawindcss
🌐 Live Demo → https://preetmax85.github.io/teawindcss
#javascript #css #webdev #vanillajs #npm #frontend #tailwindcss