Where the web gets serious. A dark editorial design system for agencies, portfolios, and SaaS builders who want their work to command attention — not blend in.
Dark editorial aesthetics that make your work stand out from every Tailwind template on Dribbble.
New Project 2026Everything here is in the free noir.css file — one download, one link tag, ready to use.
All transitions and hover states included. No JavaScript required.
Default surface background with border. Hover to see gold glow.
Frosted glass effect using CSS backdrop-filter.
Gold border and glow — for highlighted content or pricing.
Tags include a hover state. Badges are flat and decorative.
Your text here, rendered live.
Lead paragraph text. Slightly larger with relaxed line-height for comfortable reading. Muted tone to create hierarchy below the heading.
inline code<link rel="stylesheet" href="css/noir.css">
No npm. No build step. Download noir.css, link it, ship it. The entire free framework is a single file under 14kb.
<div class="n-card n-card--featured"> <span class="n-badge">New</span> <h3 class="n-h3">My Project</h3> <p class="n-body">Description...</p> <a href="#" class="n-btn">View →</a> </div>
Unlock advanced components, pre-built templates, and the full JS toolkit — everything you need to build complete, polished products.
Sticky navbar, mobile hamburger drawer, breadcrumb, and sidebar — all CSS only.
Striped, bordered, sortable-ready tables with hover states and responsive scroll.
Progress bars (indeterminate & determinate), skeleton loading states, spinners.
CSS-first modal system with backdrop, dialog sizing, and close mechanics.
Vertical timeline, numbered stepper, and changelog components.
Horizontal tabs, vertical tabs, FAQ accordion — no JS for static builds.
JS-powered toast queue. Top-right, bottom-center, with auto-dismiss timers.
Landing page, pricing, portfolio, dashboard, blog, and agency — copy, paste, ship.
TabController, ModalManager, ToastQueue, ScrollReveal — modular, no frameworks.
Pay once. Yours forever. You get the ZIP on email within a few hours of payment.
For individuals
MIT License — forever
For solo devs & freelancers
or ₹1,650 INR
PayPal buyers are redirected automatically.
UPI buyers send screenshot to confirm.
For agencies & studios
or ₹3,200 INR
PayPal buyers are redirected automatically.
UPI buyers send screenshot to confirm.
"I have tried every free CSS kit on GitHub. NOIR is the first one that genuinely looks like a design decision rather than a component dump. Shipped my portfolio in a weekend."
"Dark editorial aesthetic is exactly what my agency needed. Clients immediately feel the quality difference. The Maison templates saved us at least 20 hours per project."
"Also a fan of KABOOM from the same author — bought both. Completely different vibes, zero overlap. I switch between them depending on the brief. Both are worth it."
PayPal buyers are redirected to WhatsApp automatically with their transaction ID. UPI buyers tap the WhatsApp button after paying and send a screenshot. I send the Drive link within a few hours.
The Free tier is MIT — use it anywhere, including commercial work. Artisan and Maison tiers include a commercial license. Maison removes the attribution requirement entirely.
Yes. NOIR is plain CSS — link the file and apply the classes anywhere. It works with any framework or static site. No build pipeline required.
Completely. KABOOM is bold, comic-book chaos — loud and retro. NOIR is clean, dark, editorial — for professional and agency work. Both are from the same author and built to the same quality standard.
Download the free tier. Build something that doesn't look like everyone else's website.