The AI-native programming language. One .nyx file = full-stack app.
🌐 nyxcode.io · 🎨 demo.nyxcode.io · 📊 NyxStatus.com (378 lines of NyxCode)
AI writes most code in 2026. But it still thinks in React, Vue, and raw HTML — languages designed for humans in the '90s. Every token costs money, time, and context window.
NyxCode: 3.5x fewer tokens than Next.js. 71% cheaper AI generation.
| NyxCode | Next.js | Savings | |
|---|---|---|---|
| Lines | 378 | 1,069 | 65% fewer |
| Files | 1 | 27 | 27x fewer |
| Tokens | ~2,733 | ~9,476 | 3.5x fewer |
| AI cost | ~$0.20 | ~$0.71 | 71% cheaper |
Real benchmark: NyxStatus.com — identical full-stack SaaS, measured with cl100k_base.
npm i -g @fabudde/nyxcode
nyx build app.nyx -o dist/ # Static site
nyx build app.nyx # Full-stack (auto-detects tables/api)
nyx check app.nyx # Validate only, no output (great for CI / AI loops)
nyx dev app.nyx # Dev server + hot reload
nyx add stripe # Add package + npm installtable posts { title text required, body text, created auto }
security { table users, login email password, token jwt, protect /api/posts write }
theme { colors { primary #667eea, bg #0a0a12 } }
preset card { bg card, r 12px, p 2rem }
page / {
section style={ mw 800px, mx auto, p 2rem } {
h1 "My Blog"
form /api/posts auth { input title, submit "Post", success -> reload }
data posts = get /api/posts auth
each posts -> div preset=card { h3 .title, p .body }
}
}
page /register {
form /api/auth/register { input email, input password, submit "Register", success -> redirect / }
}
Generates: index.html, register/index.html, AND server.js with 10 CRUD endpoints, JWT auth, and SQLite. Zero config.
React — 20+ lines, 80+ tokens:
import React, { useState, useEffect } from 'react';
export default function UserList() {
const [users, setUsers] = useState([]);
useEffect(() => {
fetch('/api/users').then(r => r.json()).then(setUsers);
}, []);
return (
<div className="container">
{users.map(u => (
<div key={u.id} className="card">
<h3>{u.name}</h3><p>{u.email}</p>
</div>
))}
</div>
);
}NyxCode — 4 lines, 26 tokens:
page /users {
data users = get /api/users
each users -> card { h3 .name, p .email }
}
Same result. 76% fewer lines. 68% fewer tokens.
Every NyxCode page now ships with professional defaults — zero CSS required.
🎨 See it live → demo.nyxcode.io
What you get for free:
- Typography —
clamp()fluid sizing, -0.025em letter-spacing on headings, 1.7 line-height on body text - Buttons — Rounded, hover states, active scale, disabled opacity
- Inputs/Select/Textarea — Focus glow, placeholder styling, border transitions
- Select dropdowns — Readable options on any background (light or dark)
- Links — Smooth color transitions, underline-offset on hover
- Tables — Collapsed borders, uppercase headers, consistent padding
- Code — Monospace font stack, subtle background, padded pre blocks
- Details/Summary — Styled accordion with border and open-state separator
- Lists — Proper padding, disc/decimal markers
- Scroll — Smooth scrolling
- Focus —
:focus-visibleonly (no ugly outlines on click) - Selection — Themed purple highlight
- Disabled — 50% opacity +
pointer-events: none
All defaults use :where() — zero specificity. Your styles always win.
theme {
colors { primary #667eea, bg #0a0a12, surface #1a1a2e }
fonts { body Inter, source: google }
body { bg #0a0a12, c #f0eaff }
selection { bg rgba(155,142,196,0.3) }
defaults { a { c primary, td none } }
}
preset card { bg surface; r 12px; p 2rem }
div grid=3@1 gap=2rem { ... } # 3 cols → 1 col on mobile
nav burger brand="MySite" { ... } # Accessible hamburger menu, zero JS
style { @mobile { fs 0.9rem } } # Built-in breakpoints
component Card(title, desc, status="Active") {
div preset=card {
h3 "${title}"
p "${desc}"
span "${status}"
}
}
page / { use Card("Hello", "World") }
page / {
let count = 0
h1 "Count: ${count}"
button "+" @click { count += 1 }
}
security { table users, login email password, token jwt, protect /api/posts write }
page /dashboard auth { ... }
a "Login" visible=guest
a "Dashboard" visible=auth
data posts = get /api/posts auth {
loading -> p "Loading..."
empty -> p "No posts yet"
error -> p "Something went wrong"
}
each posts -> div { h3 .title, p .body }
table posts {
title text required
body text
author [users] # Foreign key → auto JOIN
created auto
category text default="general" # Add columns → auto-migrated
}
pipe 'new-order' {
on api POST /api/orders auth
validate $body.email is email
query "INSERT INTO orders (email, total) VALUES ($body.email, $body.total)" as result
notify email to=$body.email subject="Order #${result.id}"
respond 201 { id: $result.id, status: created }
}
theme { icons: lucide }
icon "heart" size=24
h1 "icon:map-pin Our Location"
keyframes fadeIn {
from { op 0 }
to { op 1 }
}
100+ shorthands — write less, ship faster:
| Short | CSS | Short | CSS |
|---|---|---|---|
bg |
background | c |
color |
m / p |
margin / padding | mx / px |
margin-inline / padding-inline |
w / h |
width / height | mw / mh |
max-width / max-height |
fs |
font-size | fw |
font-weight |
r |
border-radius | shadow |
box-shadow |
d |
display | pos |
position |
op |
opacity | tr |
transition |
tf |
transform | ai |
align-items |
Already know Tailwind? Use those classes in NyxCode — compiled to native CSS at build time, zero runtime:
div class="flex items-center gap-4 p-6 rounded-xl bg-white shadow-lg" {
h2 class="text-2xl font-bold text-gray-900" "Hello"
}
.nyx → Lexer → Parser → AST → Compiler → HTML + CSS + JS
→ Express + SQLite (if backend detected)
Single pipeline. No webpack. No bundler config. No node_modules for frontend.
A full-stack build emits a runnable backend: server.js plus a package.json
(pinned deps + npm start) and a README — so npm install && npm start just works.
Syntax highlighting and editor config for VS Code live in editors/vscode.
cp -r editors/vscode ~/.vscode/extensions/nyxcode-0.53.0 # then reload VS Codenpm install # install toolchain + backend deps (for e2e)
npm run build # tsc -> dist/
npm run typecheck # strict type-check, no emit
npm test # 717 unit tests (lexer/parser/compiler/security/...)
npm run test:e2e # 9 end-to-end tests: boot the generated server, hit it over HTTP
npm run test:all # build + unit + e2eUnit tests assert on generated output; the end-to-end suite compiles real apps with the CLI, starts the generated Express + SQLite server, and exercises live HTTP (CRUD persistence, validation, static frontend, auth register/login/JWT). CI runs the whole thing on Node 20/22/24.
378 lines. One file. Full SaaS.
nyxstatus.com — Uptime monitoring with JWT auth, SQLite DB, CRUD API, background health checks, email alerts, cascade deletes, responsive dark theme. 100% NyxCode.
| Version | Highlights |
|---|---|
| v0.53.0 | Runnable & Reliable — Generated backends ship a package.json (npm start works), ?? / ?. operators, CI, end-to-end runtime tests, VS Code highlighting |
| v0.52.0 | Store System v2 — Persistent stores, $reset(), $patch(), methods |
| v0.51.0 | Beautiful Defaults — Professional typography, interactive elements, focus management, select fix, all zero-config |
| v0.50.0 | Zero Patches — SolidJS reactivity, custom API routes, query aliases, when-inside-each, stdlib |
| v0.39.0 | The Language Release II — Arrays, objects, loops, mutable vars, reactivity |
| v0.32.0 | pipe — Declarative logic chains, 16 step types |
| v0.30.0 | The Language Release — let, action, on, env, email, use |
| v0.25.x | Body styles, keyframes, selection, element defaults |
| v0.24.x | Burger nav, multi-file imports, Figma import |
Fabian Budde 🐻 — Creator & Language Design Nyx 🦞 — Lead Developer & Compiler Engineering — @NyxTheLobster Tyto 🦉 — Architecture & Security Review — @heyTyto Kiro 🐺 — QA & Technical Documentation
A human and three AIs building the language that bridges both worlds.
MIT
NyxCode v0.53.0 — 717 unit + 9 e2e tests — npm — NYXCODE.md (full AI context) — demo.nyxcode.io
🦞