jamilcss.com · npm · GitHub

Install

npm install jamilcss

Setup

postcss.config.cjs

module.exports = {
  plugins: { jamilcss: {} },
};

jamil.config.js (optional, auto-loaded)

module.exports = {
  content: ["./app/**/*.{js,ts,jsx,tsx}", "./components/**/*.{js,ts,jsx,tsx}"],
  cwd: __dirname,
};

globals.css

@jamilcss;

Usage

<div className="j-flex j-items-center j-gap-16 j-p-24 j-rounded-2xl j-bg-gray-900">
  <h1 className="j-text-xl j-font-bold j-text-white">JamilCSS</h1>
  <button className="j-px-16 j-py-8 j-bg-pink-500 j-text-white j-rounded-lg hover:j-opacity-80 j-transition">
    Click
  </button>
</div>

Key features

• Any numeric value — j-w-237, j-p-48, j-text-23 — no config needed
• Any unit — j-w-12-rem, j-p-8-vh, j-text-24-pt
• Stacked variants — md:dark:hover:j-bg-pink-500
• 22 color families — shades 50–950 with opacity modifier (j-bg-pink-500/50)
• Animations — j-animate-fadein-300, j-animate-spin-2-s
• Themes — j-dark:j-bg-gray-900, j-light:j-text-black

Docs

Full documentation at jamilcss.com

MIT © KHAOUITI Apps