🦞 NyxCode

The AI-native programming language for the web.

68% fewer tokens than React. Zero config. Zero dependencies.

Install

npm install @fabudde/nyxcode

# or run directly:
npx @fabudde/nyxcode build your-page.nyx

Why NyxCode?

AI writes 80% of code in 2026. Every token costs money, time, and context window. NyxCode is the first language designed for this reality.

# React: 372 lines, 8,842 bytes
# NyxCode: 121 lines, 3,676 bytes — 68% less

page /home {
  style { bg #0a0a1a, color white, font-family Inter }
  h1 "Hello World"
  p "Built with NyxCode."
}

Features (v0.2.0)

⚡ Reactive State

state count = 0
computed double = count * 2

h1 count
button "+" -> count = count + 1

One keyword. Auto-updating DOM. No hooks, no boilerplate.

🧩 Components

# card.nyx
component Card {
  props title description
  style {
    bg white
    radius 16px
    padding 2rem
    shadow 0 4px 20px rgba(0, 0, 0, 0.08)
  }
  h3 .title
  p .description
}

# page.nyx
use "./card.nyx"

page /home {
  Card title="NyxCode" description="AI-native language"
  Card title="ForkCart" description="TypeScript e-commerce"
}

Import, reuse, compose. Props and scoped styles.

🎨 3-Tier Styling

# Tier 1: Shorthand (90% of cases)
style { bg #1a1a2e, padding 2rem, radius 12px }

# Tier 2: Style blocks with responsive + hover
style {
  bg linear-gradient(135deg, #667eea, #764ba2)
  shadow 0 4px 12px rgba(0, 0, 0, 0.15)
  hover { transform translateY(-4px) }
  @mobile { padding 1rem }
}

# Tier 3: Raw CSS escape hatch
head "<style>.custom { animation: spin 1s infinite; }</style>"

🎬 Animations

animate pulse {
  0% { transform: scale(1); }
  50% { transform: scale(1.05); }
  100% { transform: scale(1); }
}

section {
  style { animation pulse 2s infinite }
  h1 "I pulse!"
}

🔒 Secure by Default

• No eval() or new Function() — safe expression evaluator only
• Auto HTML escaping in templates
• State-key allowlist prevents prototype pollution
• CSRF protection on forms
• SQL injection structurally impossible

Audited by Tyto 🦉 (Security Advisor)

📦 Zero Config

File = route. No webpack, no tsconfig, no babel, no postcss.

npx @fabudde/nyxcode build my-page.nyx
# Done. That's it.

Benchmark

Measured on the NyxCode landing page vs equivalent React implementation.

Live Demo

• 🌐 Website: nyxcode.io
• 🎯 Showcase (built in NyxCode): nyxcode.io/showcase-nyx.html
• ⚡ Counter Demo: nyxcode.io/counter.html

CLI

npx @fabudde/nyxcode build page.nyx     # Compile to HTML
npx @fabudde/nyxcode parse page.nyx     # Output AST as JSON
npx @fabudde/nyxcode tokens page.nyx    # Show token stream

Roadmap

• v0.1 — Parser + Compiler + CLI + Landing Page
• v0.2 — Reactivity, Components, Security, npm ← you are here
• v0.3 — Routing, Form handling, Playground
• v0.4 — Database integration, API endpoints
• v0.5 — Component library, Theme system
• v1.0 — Production ready

Created By

A human and three AIs, building the language that bridges both worlds.

License

MIT — Copyright (c) 2026 Fabian Budde, Nyx & Tyto

From zero to npm in under 24 hours. The Rudel ships different. 🦞