12Authored palette entries

9Roles taken verbatim

17Roles derived

8Type steps

9Spacing steps

7Shape tokens

Ecosystem anatomy

Generated from projects/games-reborn/tokens/tokens.json — GAMES-Reborn-Network/design · tokens/brand_tokens.json + tokens/brand_styles.css ("Dark Reborn 3D")

Token documentprojects/games-reborn/tokens/tokens.json

Compiled themedist/assets/css/theme-games-reborn.css

Consumed as--ax-* custom properties

Variants3

Color tokens

Authored swatches first, then the derived ramp the CSS actually consumes.

brand

Ruby Laser Red

#b81414

Primary action and neon accent

C C:10 M:98 Y:95 K:20 PMS 186 C A 6.67 B 2.92

Electric Scarlet Flare

#ff263b

Hover, flare highlights, dual-channel energy

A 3.76 B 5.19

Crimson Shadow

#700808

Pressed states, deep bevel shadow

A 12.16 B 1.60

metal

Brushed Steel Metallic

#8f96a3

3D chrome bevels and logotypes

C C:35 M:25 Y:20 K:10 Cool Gray 8 C A 2.97 B 6.55

Platinum Bevel Highlight

#f5f7fa

Specular highlight on 3D marks

A 1.07 B 18.15

Gunmetal Shadow

#343c4d

Bevel shadow falloff

A 11.06 B 1.76

surface

Obsidian Deep

#060709

Carbon weave chassis and base background

A 20.15 B 1.03

Graphite Plate

#0f1218

Card and panel background

A 18.75 B 1.04

Armor Slate

#161a23

Elevated surface, hovered rows

A 17.41 B 1.12

border

Border Muted

rgba(255, 255, 255, 0.08)

Panel and card borders

A 1.00 B 1.19

text

Frost White

#f0f2f8

Headings and body copy on dark

A 1.12 B 17.40

Titanium Mist

#8f96a3

Captions, metadata, muted copy

A 2.97 B 6.55

derived-ramp DERIVED

Accent Glow

rgba(184, 20, 20, 0.25)

derived · --ax-accent-glow

A 1.58 B 1.14

Accent Subtle

rgba(184, 20, 20, 0.12)

derived · --ax-accent-subtle

A 1.23 B 1.05

Bg Subtle

#0d0e10

derived · --ax-bg-subtle

A 19.31 B 1.01

Surface3

#28292c

derived · --ax-surface-3

A 14.55 B 1.34

Surface Elevated

#313235

derived · --ax-surface-elevated

A 12.82 B 1.52

Border Subdued

#1d1f21

derived · --ax-border-subdued

A 16.53 B 1.18

Border Strong

#48494c

derived · --ax-border-strong

A 9.00 B 2.16

Border Hover

#5a5c5f

derived · --ax-border-hover

A 6.71 B 2.90

Text3

#5f6064

derived · --ax-text-3

A 6.28 B 3.10

Success

#10B981

derived · --ax-success

A 2.54 B 7.68

Success Glow

rgba(16, 185, 129, 0.2)

derived · --ax-success-glow

A 1.21 B 1.34

Warning

#F59E0B

derived · --ax-warning

A 2.15 B 9.07

Warning Glow

rgba(245, 158, 11, 0.2)

derived · --ax-warning-glow

A 1.16 B 1.41

Danger

#EF4444

derived · --ax-danger

A 3.76 B 5.18

Danger Glow

rgba(239, 68, 68, 0.2)

derived · --ax-danger-glow

A 1.30 B 1.22

Info

#0EA5E9

derived · --ax-info

A 2.77 B 7.03

Info Glow

rgba(14, 165, 233, 0.2)

derived · --ax-info-glow

A 1.22 B 1.32

Semantic roles → CSS custom properties

Semantic role	Custom property	Value	Source	Contrast vs surface
accent	`--ax-accent`	`#b81414`	authored	2.81:1 fail
accentHover	`--ax-accent-hover`	`#ff263b`	authored	4.99:1 AA
accentGlow	`--ax-accent-glow`	`rgba(184, 20, 20, 0.25)`	derived	1.14:1 fail
accentSubtle	`--ax-accent-subtle`	`rgba(184, 20, 20, 0.12)`	derived	1.05:1 fail
bg	`--ax-bg`	`#060709`	authored	1.07:1 fail
bgSubtle	`--ax-bg-subtle`	`#0d0e10`	derived	1.03:1 fail
surface1	`--ax-surface-1`	`#0f1218`	authored	1.00:1 fail
surface2	`--ax-surface-2`	`#161a23`	authored	1.08:1 fail
surface3	`--ax-surface-3`	`#28292c`	derived	1.29:1 fail
surfaceElevated	`--ax-surface-elevated`	`#313235`	derived	1.46:1 fail
borderSubdued	`--ax-border-subdued`	`#1d1f21`	derived	1.13:1 fail
border	`--ax-border`	`rgba(255, 255, 255, 0.08)`	authored	1.22:1 fail
borderStrong	`--ax-border-strong`	`#48494c`	derived	2.08:1 fail
borderHover	`--ax-border-hover`	`#5a5c5f`	derived	2.80:1 fail
text1	`--ax-text-1`	`#f0f2f8`	authored	16.75:1 AA
text2	`--ax-text-2`	`#8f96a3`	authored	6.30:1 AA
text3	`--ax-text-3`	`#5f6064`	derived	2.99:1 fail
textInverse	`--ax-text-inverse`	`#060709`	authored	1.07:1 fail
success	`--ax-success`	`#10B981`	derived	7.39:1 AA
successGlow	`--ax-success-glow`	`rgba(16, 185, 129, 0.2)`	derived	1.37:1 fail
warning	`--ax-warning`	`#F59E0B`	derived	8.73:1 AA
warningGlow	`--ax-warning-glow`	`rgba(245, 158, 11, 0.2)`	derived	1.43:1 fail
danger	`--ax-danger`	`#EF4444`	derived	4.98:1 AA
dangerGlow	`--ax-danger-glow`	`rgba(239, 68, 68, 0.2)`	derived	1.23:1 fail
info	`--ax-info`	`#0EA5E9`	derived	6.77:1 AA
infoGlow	`--ax-info-glow`	`rgba(14, 165, 233, 0.2)`	derived	1.34:1 fail

Typography

Families: heading → Orbitron · sans → Rajdhani · mono → JetBrains Mono · numerals → JetBrains Mono

Display 56px · 900 · 1.05 · 0.02em heading

GAMES REBORN

Heading 1 40px · 800 · 1.1 · 0.01em heading

Next-Gen Multi-Realm Platform

Heading 2 28px · 700 · 1.15 heading

Live Ops Engine

Heading 3 20px · 600 · 1.2 heading

Realm Telemetry

Body Large 18px · 500 · 1.55 sans

Fourteen game engines, one control plane.

Body Base 15px · 500 · 1.55 sans

Deploy realms, gateways and launchers from a single binary.

Caption 13px · 500 · 1.4 sans

Uptime 99.98% across 14 realms

Code Base 14px · 400 · 1.6 mono

games-reborn realm start --engine mu3 --port 55901

Spacing

Base grid 4px

1x--space-1x

4px

2x--space-2x

8px

3x--space-3x

12px

4x--space-4x

16px

6x--space-6x

24px

8x--space-8x

32px

12x--space-12x

48px

16x--space-16x

64px

24x--space-24x

96px

Radii & shadows

--radius-sm 6px

--radius-md 12px

--radius-lg 20px

--radius-pill 9999px

--shadow-glowSm 0 0 15px rgba(184, 20, 20, 0.35)

--shadow-glowLg 0 0 45px rgba(184, 20, 20, 0.55)

--shadow-card3D 0 20px 40px rgba(0, 0, 0, 0.6)

Motion

Hover the tracks to compare easing curves.

--transition-fast 0.15s cubic-bezier(0.16, 1, 0.3, 1)

--transition-normal 0.3s cubic-bezier(0.16, 1, 0.3, 1)

--transition-slow 0.6s cubic-bezier(0.16, 1, 0.3, 1)

Atoms

Indivisible interface elements compiled from the theme above.

Button variants 5 variants

html

<button class="ax-btn ax-btn-primary">Primary</button>
<button class="ax-btn ax-btn-secondary">Secondary</button>
<button class="ax-btn ax-btn-outline">Outline</button>
<button class="ax-btn ax-btn-ghost">Ghost</button>
<button class="ax-btn ax-btn-danger">Danger</button>

Button sizes sm · md · lg

html

<button class="ax-btn ax-btn-primary ax-btn-sm">Small</button>
<button class="ax-btn ax-btn-primary">Medium</button>
<button class="ax-btn ax-btn-primary ax-btn-lg">Large</button>

Button states default · hover · focus · disabled

Text input & search

html

<input class="ax-input" placeholder="Search tokens...">

Checkbox, radio, switch

Enable token sync Emit light scaffold Live reload

html

<label class="ax-checkbox"><input type="checkbox" checked> Enable token sync</label>

Badges & status

Neutral Accent Operational Degraded Offline Pill

html

<span class="ax-badge ax-badge-accent">Accent</span>
<span class="ax-badge ax-badge-success"><span class="ax-status-dot active"></span> Operational</span>

Links, keys & inline code

Anchor link with accent underline

Shortcuts ⌘K ESC --ax-accent

Icons

No icon contract declared by this ecosystem.

Molecules

Atoms bound into reusable units.

Search field molecule

⌘K

html

<div class="ds-search-molecule">…</div>

Stat card molecule

98/100

Accessibility

Tokens

Variants

Feature card molecule

◆

Token pipeline

One normalized document feeds CSS, docs and the asset index.

◇

Derived ramp

Missing roles are computed from accent, ink and paper — and badged as derived.

Callouts & notes

Note

Derived values are marked so authored intent stays distinguishable.

Tip

Click any swatch to copy its value.

Warning

Contrast below 4.5:1 fails AA for body copy.

Tabs & chips molecule

Dark Reborn 3D Rose / Amber MU3

Table molecule

Token	Value	Status
`--ax-accent`	brand accent	authored
`--ax-surface-2`	derived ramp	derived

Toast molecule

✓ Copied #FF6901 to clipboard

Organisms

Molecules composed into page-scale regions.

Header organism brand mark · nav · ecosystem switcher · command palette

DGAMES REBORN

Overview Style Guide Assets Docs

⌘K

Hero organism

Living style guide

GAMES REBORN

Multi-realm MMORPG platform · Dark Reborn 3D brand system

Open style guide Asset library

Terminal organism

build

$npm run build

▸ registry 4 ecosystems

▸ tokens 3 token documents

▸ assets 148 files

✓ dist generated in 0.4s

Matrix organism

Surface	Token set	Typography	Assets
Web	full	display + mono	svg + png
Desktop	full	display + mono	icns + png
CLI	mono only	mono	—

Role	bg	surface1	surface2	surface3
`text1`	18.00	16.75	15.55	12.99
`text2`	6.77	6.30	5.85	4.89
`text3`	3.21	2.99	2.77	2.32

Ratios computed at build time from the compiled theme — switch the palette variant in the header and this table is regenerated for that variant on the next build.