jackiew-css
atom css engine inspired by antfu
Features
⚡️ It's FAST🧩 On-demand CSS utilities🔥 Hot module replacement (HMR)🎳 Support Variant Groups - e.g.bg-gray-200 hover:(bg-gray-100 text-red-300)
🌑 Support Dark mode📱 Support Screen BreackPoints
Documentation
Read the documentation for more details.
install
npm install @jackiew/atomcss
Quick Start
In vite.config.ts
import { AtomCss } from "./packages/index";
export default defineConfig({
plugins: [AtomCss({})],
});
Custom Rules
css rules
...
plugins: [
AtomCss({
rules: [
[/^text-big$/, [["font-size", "48px"]]],
// ignore first parameter
[/^(?:width|w)-(\d+)%$/, ([, val])=>[["width", `${val}%`]]],
],
// etc..
}),
],
...
Browser Support
Edge | Chrome | Safari |
---|---|---|
Edge | Last two versions | Last two versions |
License
MIT License © 2022 JackieWong
Looking forward to your suggestion!!