{"repo":"typicode/mistcss","free":true,"listed":false,"github":"https://github.com/typicode/mistcss","clone":"git clone https://github.com/typicode/mistcss.git","description":"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.","language":"JavaScript","stars":1635,"topics":["css","css-in-js","next","nextjs","react","remix","remix-run","styling"],"license":"MIT","category":"saas-starters-boilerplates","readme_excerpt":"MistCSS Simplicity is the ultimate sophistication MistCSS lets you create reusable visual components without JavaScript or TypeScript ( think about it for a second... no JS/TS needed ). Leverage native HTML and CSS, get type safety and autocomplete. Just clean and efficient styling. What you see above is standard HTML (data-attributes) and CSS (nested CSS). MistCSS simply creates a d.ts file based on your CSS. Features - 🥶 Not just zero-runtime, it goes beyond. It's zero JavaScript, not even for components, resulting in smaller bundles and faster code. - 💎 What you write is what you get. No transformations, easy debugging. - 🎒 Standards-based, reusable styles across frameworks, compatible with Tailwind or any CSS framework - ⚡️ Instantly productive, no learning curve, simple on-boarding. - 💖 Back to basics with a modern twist: access the full power of HTML and CSS, enhanced with type safety and code completion (without the complexity). Differences CSS-in-JS MistCSS -------------------- -------------------------------------- ----------------------------- Runtime 0-10 KB 0 KB JavaScript functions a few KB per component 0 KB TypeScript code yes (at least for props) no (generated for the user) Debugging react devtools browser inspector Syntax highlighting depends (may require extension) no additional extension Generated bundle runtime + JS functions + logic + CSS CSS This is general comparison and may vary depending on the library you're using. Usage Traditional approaches re","default_branch":null,"files":null,"tree":[],"storefront":"/r/typicode","claimed":false,"request_supported":{"post":"https://gitbuyer.com/r/typicode/mistcss/request-supported","requests":0},"note":"indexed from public GitHub; nothing is for sale on this page. Clone it from GitHub. Paid listings live at /search."}