v1.1 — Zero Build Step

Utility-First CSS
Powered by JS

A lightweight CSS utility engine inspired by Tailwind. Drop the script, write chai- classes, done.

Get Started → Live Demo
<div class="chai-flex chai-items-center chai-gap-16">
  <h1 class="chai-size-48 chai-fontBold">Hello, Chai!</h1>
  <button class="chai-px-20 chai-py-10 chai-rounded-8
    chai-bg-#ff9f43 chai-shadow-md">
    Click me
  </button>
</div>

Why ChaiCSS?

Everything you need, nothing you don't.

Zero Build Step

Drop one script tag. No bundler, no config, no CLI. Works in any HTML file instantly.

🎯

Utility-First

Compose layouts using small, readable classes — no context switching to CSS files.

🔌

DOM Powered

Scans the DOM and applies inline styles dynamically at runtime. Smart and extensible.

📦

70+ Utilities

Spacing, flex, grid, typography, shadows, transitions, opacity, transforms — all covered.

Live Playground

Hover any class to see what it does.

Class Categories

Preview

ChaiCSS Box
Applied class hover to select

All Utilities

Every class, what it does, and the CSS it generates.

New in v1.1

Freshly Added Classes

Added to the engine — ready to use right now.

Install in 3 seconds

Three ways to get started. Pick your flavour.

CDN <script src="https://cdn.jsdelivr.net/npm/chaicss-ap/dist/index.js"></script>
NPM npm install chaicss-ap
ES Module import { useChaiCss } from 'chaicss-ap';
useChaiCss();