// the find
typicode/mistcss
Create visual components for React without JavaScript or TypeScript. Leverage native HTML and CSS. It's an alternative to CSS-in-JS and CSS modules.
MistCSS generates TypeScript declaration files from CSS, so you can write plain HTML data-attributes and get type safety in JSX without wrapping everything in JavaScript component functions. It's a PostCSS plugin that reads your CSS selectors and outputs a .d.ts file that extends JSX intrinsic elements. Aimed at React/Next/Remix developers who are tired of boilerplate prop types for purely visual components.
The core idea is genuinely clever — hijacking the JSX intrinsic elements namespace means you get autocomplete and type errors for free, with no runtime cost whatsoever. Using data-attributes as the API surface avoids naming conflicts with native HTML attributes, which is a real problem CSS-in-JS often ignores. Zero bundle impact is not a marketing claim here; there is literally no JS emitted for components, just CSS. Works with Tailwind, CSS variables, and @import splitting without any special integration.
Extending JSX intrinsic elements globally means every <button> in your app now has your custom data-attributes available, which will confuse anyone who didn't write the CSS. There's no way to scope types to specific components without naming conventions you enforce yourself. Dynamic styles based on runtime values still require falling back to inline style or className, so any theme switching or animated state beyond CSS :hover and @keyframes breaks the model. With 55 forks and last activity in February 2026, the ecosystem is thin — if PostCSS or the CSS nesting spec shifts, there's not much community to absorb the breakage.