A dark-mode-native CSS & JS toolkit. Theme everything from one token, compose 50+ prebuilt components, and bring them to life with a zero-dependency runtime — RTL and Arabic typography in the box.
Shipping in production at fast-moving teams
Two files, no build step. Link the stylesheet, opt your <body> into Nyx, and add the runtime for tabs, modals and toasts.
<!-- 1. the framework -->
<link rel="stylesheet" href="nyx.css">
<!-- 2. opt the body in -->
<body class="nyx nyx-reset">
<button class="nyx-btn nyx-btn-primary">Hello</button>
<!-- 3. the runtime -->
<script src="nyx.js"></script>Opinionated defaults, a token system you can retheme in one line, and behaviors that need no JavaScript to wire up.
Every interactive element is lit from within — colored glows, layered surfaces and glass that give the UI real depth on a dark canvas.
Override a single --nyx-* token to recolor the whole UI.
A tiny vanilla-JS runtime. No build step, no lock-in.
0Logical properties mirror every component automatically.
Wire modals, tabs and drawers with attributes — no code.
One layout reflows to every screen — with the accessibility work already done for you.
Each component has its own page with usage, live examples and a class reference. Jump in:
Six variants, glow, loading & icon styles.
Glass, gradient, stat & feature layouts.
Inputs, selects, switches & search.
Sortable tables, data grids, KPI rows.
Modal, drawer, tooltip, popover.
Spotlight, orbit, meter, timeline & more.
Ambient backdrops, zero-dependency data viz and a copy-ready code block — all accent-driven, RTL-safe and reduced-motion aware.
An honest comparison with popular frameworks — focused on what matters when you build for Arabic and RTL.
| Feature | NYX | Tailwind | Bootstrap |
|---|---|---|---|
| Bundled authentic Arabic fonts | — | — | |
| Arabic numerals & Hijri calendar | — | — | |
| RTL via logical CSS properties | plugin | ||
| Ready-made components, no JS to write | — | ||
| No build step | — | ||
| “Lit depth” dark-first aesthetic | — | — |
Illustrative comparison; every framework is great at what it does — NYX is tuned for Arabic first.
Zero setup, zero dependencies. Drop in two files and ship a luminous, RTL-ready interface today.
Customize NYX live