20Authored palette entries

15Roles taken verbatim

11Roles derived

8Type steps

9Spacing steps

7Shape tokens

Ecosystem anatomy

Generated from projects/merlin/tokens/tokens.json — merlin-tribukait-branding · 06_design_tokens/brand_tokens.json + BRAND_GUIDEBOOK.html

Token documentprojects/merlin/tokens/tokens.json

Compiled themedist/assets/css/theme-merlin.css

Consumed as--ax-* custom properties

Variants1

Color tokens

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

brand

Primary Neon

#00f0ff

Bevel glow, active links, laser borders

A 1.41 B 13.83

Secondary Accent

#ff2d55

Dual-channel energy, flare highlights

A 3.65 B 5.34

metal

Brushed Titanium

#8f96a3

3D chrome bevels & logotypes

A 2.97 B 6.55

Titanium Highlight

#a0a4b8

Upper bevel, subtitle copy

A 2.47 B 7.88

surface

Obsidian Dark

#08080c

Carbon weave chassis & base background

A 19.99 B 1.03

Void

#040508

Deepest backdrop behind glow fields

A 20.38 B 1.05

Surface

#12121c

Card and panel background

A 18.60 B 1.05

Surface Raised

#171d2b

Hovered panels, raised plates

A 16.84 B 1.16

Surface High

#1e2638

Modals, popovers

A 15.11 B 1.29

Surface Peak

#2b354c

Highest plate in the ramp

A 12.24 B 1.59

border

Border

rgba(255, 255, 255, 0.08)

Panel and card borders

A 1.00 B 1.19

text

Text Primary

#f0f2f8

Headings and body copy

A 1.12 B 17.40

Text Secondary

#e2e6f0

Lead paragraphs

A 1.25 B 15.59

Text Muted

#8f96a3

Captions, metadata

A 2.97 B 6.55

status

Sky

#38bdf8

Informational accents

A 2.14 B 9.09

Violet

#a855f7

Tertiary energy channel

A 3.96 B 4.92

Crimson

#ef4444

Errors and destructive actions

A 3.76 B 5.18

Deep Crimson

#b91c1c

Error pressed state

A 6.47 B 3.01

Amber

#f59e0b

Warnings and notices

A 2.15 B 9.07

Mint

#10b981

Success and operational status

A 2.54 B 7.68

derived-ramp DERIVED

Accent Hover

#00d3e0

derived · --ax-accent-hover

A 1.84 B 10.57

Accent Glow

rgba(0, 240, 255, 0.25)

derived · --ax-accent-glow

A 1.14 B 1.84

Accent Subtle

rgba(0, 240, 255, 0.12)

derived · --ax-accent-subtle

A 1.07 B 1.25

Bg Subtle

#0f0f13

derived · --ax-bg-subtle

A 19.12 B 1.02

Border Subdued

#1f1f24

derived · --ax-border-subdued

A 16.41 B 1.19

Border Strong

#494a4e

derived · --ax-border-strong

A 8.85 B 2.20

Border Hover

#5c5c61

derived · --ax-border-hover

A 6.65 B 2.93

Success Glow

rgba(16, 185, 129, 0.2)

derived · --ax-success-glow

A 1.21 B 1.34

Warning Glow

rgba(245, 158, 11, 0.2)

derived · --ax-warning-glow

A 1.16 B 1.41

Danger Glow

rgba(239, 68, 68, 0.2)

derived · --ax-danger-glow

A 1.30 B 1.22

Info Glow

rgba(56, 189, 248, 0.2)

derived · --ax-info-glow

A 1.17 B 1.41

Semantic roles → CSS custom properties

Semantic role	Custom property	Value	Source	Contrast vs surface
accent	`--ax-accent`	`#00f0ff`	authored	13.20:1 AA
accentHover	`--ax-accent-hover`	`#00d3e0`	derived	10.09:1 AA
accentGlow	`--ax-accent-glow`	`rgba(0, 240, 255, 0.25)`	derived	1.89:1 fail
accentSubtle	`--ax-accent-subtle`	`rgba(0, 240, 255, 0.12)`	derived	1.29:1 fail
bg	`--ax-bg`	`#08080c`	authored	1.07:1 fail
bgSubtle	`--ax-bg-subtle`	`#0f0f13`	derived	1.03:1 fail
surface1	`--ax-surface-1`	`#12121c`	authored	1.00:1 fail
surface2	`--ax-surface-2`	`#171d2b`	authored	1.10:1 fail
surface3	`--ax-surface-3`	`#1e2638`	authored	1.23:1 fail
surfaceElevated	`--ax-surface-elevated`	`#2b354c`	authored	1.52:1 fail
borderSubdued	`--ax-border-subdued`	`#1f1f24`	derived	1.13:1 fail
border	`--ax-border`	`rgba(255, 255, 255, 0.08)`	authored	1.22:1 fail
borderStrong	`--ax-border-strong`	`#494a4e`	derived	2.10:1 fail
borderHover	`--ax-border-hover`	`#5c5c61`	derived	2.80:1 fail
text1	`--ax-text-1`	`#f0f2f8`	authored	16.62:1 AA
text2	`--ax-text-2`	`#e2e6f0`	authored	14.89:1 AA
text3	`--ax-text-3`	`#8f96a3`	authored	6.25:1 AA
textInverse	`--ax-text-inverse`	`#08080c`	authored	1.07:1 fail
success	`--ax-success`	`#10b981`	authored	7.33:1 AA
successGlow	`--ax-success-glow`	`rgba(16, 185, 129, 0.2)`	derived	1.37:1 fail
warning	`--ax-warning`	`#f59e0b`	authored	8.66:1 AA
warningGlow	`--ax-warning-glow`	`rgba(245, 158, 11, 0.2)`	derived	1.43:1 fail
danger	`--ax-danger`	`#ef4444`	authored	4.94:1 AA
dangerGlow	`--ax-danger-glow`	`rgba(239, 68, 68, 0.2)`	derived	1.24:1 fail
info	`--ax-info`	`#38bdf8`	authored	8.68:1 AA
infoGlow	`--ax-info-glow`	`rgba(56, 189, 248, 0.2)`	derived	1.44:1 fail

Typography

Families: heading → Inter · sans → Inter · mono → JetBrains Mono · numerals → JetBrains Mono

Display Hero 56px · 800 · 1.05 · -0.02em heading

Merlin Tribukait

Heading 1 40px · 700 · 1.1 heading

Molecular Brand Identity

Heading 2 32px · 700 · 1.15 heading

Atomic Tokens

Heading 3 24px · 600 · 1.2 heading

Molecular Lockups

Body Large 18px · 400 · 1.6 sans

A single system spanning hero, launcher and showroom.

Body Base 16px · 400 · 1.6 sans

Tokens cascade from atoms to organisms without drift.

Caption 13px · 500 · 1.4 sans

LEVEL 01 · Atomic Tokens

Code Base 14px · 400 · 1.6 mono

var(--mt-primary) /* #00f0ff */

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 10px

--radius-lg 16px

--radius-pill 9999px

--shadow-glow 0 0 24px #00f0ff40

--shadow-glowStrong 0 0 36px #00f0ff80

--shadow-card 0 16px 40px rgba(0, 0, 0, 0.6)

Motion

Hover the tracks to compare easing curves.

--transition-fast 0.15s cubic-bezier(0.2, 0, 0, 1)

--transition-normal 0.25s cubic-bezier(0.22, 1, 0.36, 1)

--transition-slow 0.4s cubic-bezier(0.22, 1, 0.36, 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

cli terminal

core engine

mesh network

protocol intel

shield security

Inlined from assets/vectors/ — vector masters, no rasterisation.

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

DMerlin Tribukait

Overview Style Guide Assets Docs

⌘K

Hero organism

Living style guide

Merlin Tribukait

Personal identity · Molecular Brand Identity & Design 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`	17.86	16.62	15.04	13.50
`text2`	16.00	14.89	13.48	12.10
`text3`	6.72	6.25	5.66	5.08

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.