01Color SystemComplete Palette · Lime + Gold Editions
Canonical Color System
`foundations` is now the canonical route for color presentation. Both brandbook editions are documented here with complete accent, surface, text, border and contrast systems. `globals.css` remains the runtime source of truth.
Theme Edition
Lime Theme
Dark Cockpit Edition
Original AIOX high-contrast system. Neutral black base, terminal-lime accent, warm off-white typography.
Accent
--bb-lime
Canvas
--bb-canvas
Surface
--bb-surface
Text
--bb-cream
Accent & SignalsPrimary accent, info, flare, error
Aaoklch(0.934 0.2264 121.95)
--bb-lime
oklch(0.934 0.2264 121.95)
Primary accent. CTA, active states, emphasis, kinetic highlights.
Aaoklch(0.669 0.1837 248.81)
--bb-blue
oklch(0.669 0.1837 248.81)
Info accent. Secondary feedback and utility cues.
Aaoklch(0.631 0.2116 36.21)
--bb-flare
oklch(0.631 0.2116 36.21)
Warm counter-accent. Editorial heat and alerts.
Aaoklch(0.6368 0.2078 25.33)
--bb-error
oklch(0.6368 0.2078 25.33)
Destructive/error state. Validation and danger cues.
Surface StackCanvas, shells, panels, console
Aavar(--bb-dark)
--bb-canvas
var(--bb-dark)
Document canvas. Main route background.
Aaoklch(0.1149 0 0)
--bb-dark
oklch(0.1149 0 0)
Dark shell. Hero panels, editorial density, hard contrast.
Aaoklch(0.1693 0.0041 285.95)
--bb-surface
oklch(0.1693 0.0041 285.95)
Primary raised surface. Cards, top bars, shell modules.
Aaoklch(0.231 0.0099 124.97)
--bb-surface-alt
oklch(0.231 0.0099 124.97)
Secondary surface. Nested blocks and alternate rows.
Aaoklch(0.1785 0.0041 285.98)
--bb-surface-panel
oklch(0.1785 0.0041 285.98)
Panel shell. Sidebars, drawers, utility layers.
Aaoklch(0.184 0.0081 118.61)
--bb-surface-console
oklch(0.184 0.0081 118.61)
Console/terminal zone. Utility output and mono previews.
Aaoklch(0.1971 0.006 285.84)
--bb-surface-hover-strong
oklch(0.1971 0.006 285.84)
Heavy hover state. Controls and selected shells.
Text & Reading LayerText hierarchy and light neutrals
Aaoklch(0.9639 0.0158 106.69)
--bb-cream
oklch(0.9639 0.0158 106.69)
Primary reading color. Headlines and body text.
Aaoklch(0.9644 0.0172 103.15)
--bb-cream-alt
oklch(0.9644 0.0172 103.15)
Soft alternate off-white. UI variants and large fields.
Aaoklch(0.9952 0.0235 106.82)
--bb-warm-white
oklch(0.9952 0.0235 106.82)
Purest light. Mark/logo and maximum contrast details.
Aargba(245, 244, 231, 0.4)
--bb-dim
rgba(245, 244, 231, 0.4)
Muted copy. Labels, captions, secondary descriptions.
Aaoklch(0.7952 0 0)
--bb-muted
oklch(0.7952 0 0)
Neutral light support. Tertiary text and subtle separators.
Aaoklch(0.6927 0 0)
--bb-meta
oklch(0.6927 0 0)
Metadata color. Counters, supporting UI, technical labels.
Neutral ScaleGray system and bridge tones
Aaoklch(0.36 0 0)
--bb-gray-charcoal
oklch(0.36 0 0)
Heavy neutral. Utility fills and strong separators.
Aaoklch(0.5208 0 0)
--bb-gray-dim
oklch(0.5208 0 0)
Mid dark neutral. Placeholder surfaces and utility blocks.
Aaoklch(0.683 0 0)
--bb-gray-muted
oklch(0.683 0 0)
Muted support. Soft chip fills and subdued UI.
Aaoklch(0.7984 0 0)
--bb-gray-silver
oklch(0.7984 0 0)
Light neutral. Delicate fills and border-led components.
Aaoklch(0.5173 0 0)
--bb-muted-legacy
oklch(0.5173 0 0)
Legacy neutral bridge. Compatibility layers and old docs.
Border SystemNeutral separation tokens
--bb-border
rgba(156, 156, 156, 0.15)
Default border. Grid, rules, low-noise separation.
--bb-border-soft
rgba(156, 156, 156, 0.10)
Soft border. Hairline dividers and subtle separators.
--bb-border-strong
rgba(156, 156, 156, 0.25)
Strong border. Active shell and high-contrast framing.
--bb-border-hover
rgba(156, 156, 156, 0.24)
Hover border. Interactive feedback for surfaces.
--bb-border-input
rgba(156, 156, 156, 0.2)
Form border. Inputs, textareas, data entry zones.
Accent Opacity LadderTheme glow and overlay scale
--bb-accent-02
rgba(209, 255, 0, 0.02)
--bb-accent-04
rgba(209, 255, 0, 0.04)
--bb-accent-05
rgba(209, 255, 0, 0.05)
--bb-accent-06
rgba(209, 255, 0, 0.06)
--bb-accent-08
rgba(209, 255, 0, 0.08)
--bb-accent-10
rgba(209, 255, 0, 0.1)
--bb-accent-12
rgba(209, 255, 0, 0.12)
--bb-accent-15
rgba(209, 255, 0, 0.15)
--bb-accent-20
rgba(209, 255, 0, 0.2)
--bb-accent-25
rgba(209, 255, 0, 0.25)
--bb-accent-40
rgba(209, 255, 0, 0.4)
--bb-accent-50
rgba(209, 255, 0, 0.5)
--bb-accent-75
rgba(209, 255, 0, 0.75)
--bb-accent-90
rgba(209, 255, 0, 0.9)
Contrast PairsApproved high-contrast combinations
Lime / Dark
--bb-lime on --bb-dark
Cream / Canvas
--bb-cream on --bb-canvas
Dark / Lime
--bb-dark on --bb-lime
Blue / Dark
--bb-blue on --bb-dark
Theme Edition
Gold Theme
Golden Guideline Edition
Neutral black foundation with a restrained champagne accent. Same dark system architecture, different emphasis layer.
Accent
--bb-lime
Canvas
--bb-canvas
Surface
--bb-surface
Text
--bb-cream
Accent & SignalsPrimary accent, info, flare, error
Aa#DDD1BB
--bb-lime
#DDD1BB
Primary gold accent. Active states, badges, premium highlights.
Aaoklch(0.669 0.1837 248.81)
--bb-blue
oklch(0.669 0.1837 248.81)
Info accent. Preserved for shared system semantics.
Aa#C4B7A2
--bb-flare
#C4B7A2
Warm support accent. Secondary emphasis and richer highlights.
Aaoklch(0.6368 0.2078 25.33)
--bb-error
oklch(0.6368 0.2078 25.33)
Destructive/error state. Shared semantic warning language.
Surface StackCanvas, shells, panels, console
Aa#09090A
--bb-canvas
#09090A
Document canvas. Neutral black foundation for the edition.
Aa#121213
--bb-dark
#121213
Dark shell. Major panels and editorial contrast zones.
Aa#151517
--bb-surface
#151517
Primary elevated surface. Cards, nav, foundation blocks.
Aa#1D1D20
--bb-surface-alt
#1D1D20
Alternate surface. Nested layers and secondary grouping.
Aa#18181B
--bb-surface-panel
#18181B
Panel shell. Drawers, sidebars, supporting containers.
Aa#222225
--bb-surface-console
#222225
Dark utility console. Dense technical and mono moments.
Aa#28282C
--bb-surface-hover-strong
#28282C
Strong hover/selection shell. Elevated interactivity.
Text & Reading LayerText hierarchy and light neutrals
Aa#F4F4F4
--bb-cream
#F4F4F4
Primary text. Clean neutral reading layer.
Aa#E8E8E8
--bb-cream-alt
#E8E8E8
Alternate light neutral. Secondary fields and tonal variation.
Aa#FFFFFF
--bb-warm-white
#FFFFFF
Maximum contrast white. Marks and highest-priority detail.
Aargba(244, 244, 244, 0.52)
--bb-dim
rgba(244, 244, 244, 0.52)
Muted copy. Supporting metadata and low-emphasis body.
Aa#DDDDDD
--bb-muted
#DDDDDD
Soft neutral. Utility text and quiet secondary layers.
Aa#AFAFAF
--bb-meta
#AFAFAF
Metadata color. Counters, labels, informational chrome.
Neutral ScaleGray system and bridge tones
Aa#313131
--bb-gray-charcoal
#313131
Dense neutral. Heavy framing and utility surfaces.
Aa#484848
--bb-gray-dim
#484848
Mid neutral. Secondary chips, placeholders, subtle blocks.
Aa#6E6E6E
--bb-gray-muted
#6E6E6E
Muted support. Soft UI moments and low-priority contrast.
Aa#919191
--bb-gray-silver
#919191
Light neutral. Fine fills and structural detailing.
Aa#919191
--bb-muted-legacy
#919191
Legacy bridge neutral. Compatibility with shared patterns.
Border SystemNeutral separation tokens
--bb-border
rgba(255, 255, 255, 0.09)
Default border. Neutral separation with no gold tint.
--bb-border-soft
rgba(255, 255, 255, 0.05)
Soft border. Quiet framing and low-noise structure.
--bb-border-strong
rgba(255, 255, 255, 0.15)
High-contrast border. Strong shell framing and active states.
--bb-border-hover
rgba(255, 255, 255, 0.18)
Interactive border. Hover cues without color contamination.
--bb-border-input
rgba(255, 255, 255, 0.12)
Input border. Neutral form language for the edition.
Accent Opacity LadderTheme glow and overlay scale
--bb-accent-02
rgba(221, 209, 187, 0.02)
--bb-accent-04
rgba(221, 209, 187, 0.04)
--bb-accent-05
rgba(221, 209, 187, 0.05)
--bb-accent-06
rgba(221, 209, 187, 0.06)
--bb-accent-08
rgba(221, 209, 187, 0.08)
--bb-accent-10
rgba(221, 209, 187, 0.1)
--bb-accent-12
rgba(221, 209, 187, 0.12)
--bb-accent-15
rgba(221, 209, 187, 0.15)
--bb-accent-20
rgba(221, 209, 187, 0.2)
--bb-accent-25
rgba(221, 209, 187, 0.25)
--bb-accent-40
rgba(221, 209, 187, 0.4)
--bb-accent-50
rgba(221, 209, 187, 0.5)
--bb-accent-75
rgba(221, 209, 187, 0.75)
--bb-accent-90
rgba(221, 209, 187, 0.9)
Contrast PairsApproved high-contrast combinations
Gold / Dark
--bb-lime on --bb-dark
Cream / Canvas
--bb-cream on --bb-canvas
Ink / Gold
--bb-ink on --bb-lime
Silver / Surface
--bb-gray-silver on --bb-surface
02Semantic Aliasesshadcn/ui token mapping
shadcn TokenMaps ToUsage
--background--bb-canvasPage background
--foreground--bb-creamDefault text
--primary--bb-limePrimary actions
--primary-foreground--bb-darkText on primary
--secondary--bb-surface-altSecondary bg
--muted--bb-surface-panelMuted backgrounds
--muted-foreground--bb-dimMuted text
--accent--bb-accent-10Accent backgrounds
--accent-foreground--bb-limeAccent text
--destructive--bb-errorError/destructive
--border--bb-borderDefault borders
--input--bb-border-inputInput borders
--ring--bb-accent-40Focus ring
--card--bb-surfaceCard bg
--card-foreground--bb-creamCard text
--popover--bb-surfacePopover bg
--popover-foreground--bb-creamPopover text