ALI AGENTS: Web3 Visual Identity System
Description
Role &
Responsibilities
A comprehensive 42-page brand architecture system engineered for a decentralized AI ecosystem. This project establishes strict visual guidelines, scalable logo construction, and a highly accessible UI typography system optimized for both dark and light digital environments.
A comprehensive 42-page brand architecture system engineered for a decentralized AI ecosystem. This project establishes strict visual guidelines, scalable logo construction, and a highly accessible UI typography system optimized for both dark and light digital environments.
Technical Info
Client: ALI Agents
Role: Lead UI/UX Designer & Brand Architect
Scope: Visual Identity, Logo System, Typography Guidelines, Color Architecture, Web3 UI Systems
Year: 2025
Client: ALI Agents
Role: Lead UI/UX Designer & Brand Architect
Scope: Visual Identity, Logo System, Typography Guidelines, Color Architecture, Web3 UI Systems
Year: 2025
Tools

Cinema 4D

Octane Render

Cinema 4D

Octane Render
The Official Logo System
Our visual identity is built on a precise geometric foundation. These official horizontal and stacked variations serve as the primary assets for all brand communications.
Our visual identity is built on a precise geometric foundation. These official horizontal and stacked variations serve as the primary assets for all brand communications.
Environment Adaptability
Each lockup is meticulously engineered with specific color palettes for Dark and Light Mode interfaces. This guarantees absolute clarity and structural integrity across any digital background.
Each lockup is meticulously engineered with specific color palettes for Dark and Light Mode interfaces. This guarantees absolute clarity and structural integrity across any digital background.
The Core Identity: 30° Isometric Grid
The Core Identity: 30° Isometric Grid
The ALI Agents emblem is engineered upon a strict 30° isometric projection grid. This precise geometric framework forms the exact core from which the outer hexagon and internal structural nodes are generated. By utilizing equal foreshortening across all axes, the design achieves perfect mathematical balance and visually articulates the seamless integration of artificial intelligence with decentralized blockchain technology.
The ALI Agents emblem is engineered upon a strict 30° isometric projection grid. This precise geometric framework forms the exact core from which the outer hexagon and internal structural nodes are generated. By utilizing equal foreshortening across all axes, the design achieves perfect mathematical balance and visually articulates the seamless integration of artificial intelligence with decentralized blockchain technology.
Structural Integrity
The bold outer boundary signifies a reliable, secure blockchain environment, built to maintain balance and efficiency.
The bold outer boundary signifies a reliable, secure blockchain environment, built to maintain balance and efficiency.
Interconnected Nodes
The inner geometric network represents highly active, collaborative agents working within a cohesive decentralized ecosystem.
The inner geometric network represents highly active, collaborative agents working within a cohesive decentralized ecosystem.
Infinite Scalability
A repeating pattern of smaller hexagons visually showcases the immense depth, potential, and adaptability of the technology.
A repeating pattern of smaller hexagons visually showcases the immense depth, potential, and adaptability of the technology.
The Logotype
The Logotype
A refined evolution of the Jakarta typeface, the logotype is custom-engineered to complement the geometric complexity of the logomark. I crafted bespoke letterforms, specifically applying a straight-cut terminal to the descender of the lowercase "g". This modification mirrors the stem angles throughout the wordmark and ensures perfect visual harmony.
A refined evolution of the Jakarta typeface, the logotype is custom-engineered to complement the geometric complexity of the logomark. I crafted bespoke letterforms, specifically applying a straight-cut terminal to the descender of the lowercase "g". This modification mirrors the stem angles throughout the wordmark and ensures perfect visual harmony.
Spatial Rules & Clear Space
To protect the brand's visibility across dynamic digital environments, a strict protective zone is enforced. The minimum clear space is mathematically defined by the exact height of the inner hexagon, ensuring absolute visual balance on any canvas.
To protect the brand's visibility across dynamic digital environments, a strict protective zone is enforced. The minimum clear space is mathematically defined by the exact height of the inner hexagon, ensuring absolute visual balance on any canvas.
Minimum Size for Print & Digital
Minimum Size for Print & Digital
Minimum Size for Print & Digital
Strict minimum size guidelines ensure the ALI Agents logo remains clear and legible across every format. These specifications prevent structural distortion and preserve consistent brand integrity on both screens and physical media.
Strict minimum size guidelines ensure the ALI Agents logo remains clear and legible across every format. These specifications prevent structural distortion and preserve consistent brand integrity on both screens and physical media.
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Backgrounds, cards, UI sections
#2E2E2E
C:70
M:64
Y:63
K:63
Dividers, low-priority text
#444444
C:67
M:60
Y:59
K:44
Subdued secondary text, borders
#767676
C:55
M:47
Y:46
K:12
Highlights, subtle text, accents
#F5F5F5
C:3
M:2
Y:2
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
Background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:53
M:53
Y:77
K:38
#AD8F57
C:32
M:40
Y:75
K:6
#D7B162
C:17
M:29
Y:73
K:0
#CEAA61
C:20
M:31
Y:73
K:0
#D5B874
C:18
M:25
Y:64
K:0
#746741
C:49
M:48
Y:80
K:25
gold gradient
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Backgrounds, cards, UI sections
#2E2E2E
C:70
M:64
Y:63
K:63
Dividers, low-priority text
#444444
C:67
M:60
Y:59
K:44
Subdued secondary text, borders
#767676
C:55
M:47
Y:46
K:12
Highlights, subtle text, accents
#F5F5F5
C:3
M:2
Y:2
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
Background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:53
M:53
Y:77
K:38
#AD8F57
C:32
M:40
Y:75
K:6
#D7B162
C:17
M:29
Y:73
K:0
#CEAA61
C:20
M:31
Y:73
K:0
#D5B874
C:18
M:25
Y:64
K:0
#746741
C:49
M:48
Y:80
K:25
gold gradient
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Backgrounds, cards, UI sections
#2E2E2E
C:70
M:64
Y:63
K:63
Dividers, low-priority text
#444444
C:67
M:60
Y:59
K:44
Subdued secondary text, borders
#767676
C:55
M:47
Y:46
K:12
Highlights, subtle text, accents
#F5F5F5
C:3
M:2
Y:2
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
Background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:53
M:53
Y:77
K:38
#AD8F57
C:32
M:40
Y:75
K:6
#D7B162
C:17
M:29
Y:73
K:0
#CEAA61
C:20
M:31
Y:73
K:0
#D5B874
C:18
M:25
Y:64
K:0
#746741
C:49
M:48
Y:80
K:25
gold gradient
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Backgrounds, cards, UI sections
#2E2E2E
C:70
M:64
Y:63
K:63
Dividers, low-priority text
#444444
C:67
M:60
Y:59
K:44
Subdued secondary text, borders
#767676
C:55
M:47
Y:46
K:12
Highlights, subtle text, accents
#F5F5F5
C:3
M:2
Y:2
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
Background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:53
M:53
Y:77
K:38
#AD8F57
C:32
M:40
Y:75
K:6
#D7B162
C:17
M:29
Y:73
K:0
#CEAA61
C:20
M:31
Y:73
K:0
#D5B874
C:18
M:25
Y:64
K:0
#746741
C:49
M:48
Y:80
K:25
gold gradient
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
Color Architecture
Branding Primary Colors for Dark Mode
Engineered for structural depth without visual fatigue. Gold (#D9A600) serves as the primary highlight with a 8.58:1 contrast ratio against true black background (#0F0F0F). A curated neutral gray scale supports UI hierarchy across cards, dividers, and secondary text while remaining fully WCAG-compliant.
Mark
#D9A600
C:16
M:34
Y:100
K:0
Logotype
#B1B1B1
C:32
M:25
Y:26
K:0
BG
#0F0F0F
C:74
M:67
Y:66
K:84
Highlight
#FFFFFF
C:0
M:0
Y:0
K:0
Color Architecture
Secondary Colors: Dark Mode
A structured UI surface palette engineered for visual depth without fatigue. Charcoal (#2E2E2E) elevates cards and modals, Mid Gray (#444444) handles dividers and borders, and Accent Gray (#767676) anchors secondary text. Soft White (#F5F5F5) delivers highlights while preserving the dark mode atmosphere.
Background, cards, UI sections
#2E2E2E
C:16
M:34
Y:100
K:0
low-priority text
#444444
C:32
M:25
Y:26
K:0
Subdued secondary text
#767676
C:74
M:67
Y:66
K:84
Highlights, subtle text, accent
#F5F5F5
C:0
M:0
Y:0
K:0
Color Architecture
Branding Primary Colors for Light Mode
Engineered for strong visual impact on bright surfaces. Gold (#996C00) serves as the primary highlight with a 4.66:1 contrast ratio against pure white (#FFFFFF). A balanced dark gray logotype (#2E2E2E) and accent highlights (#444444) maintain a sophisticated, readable aesthetic across all light environments.
Mark
#996C00
C:34
M:53
Y:100
K:17
background
#F5F5F5
C:3
M:2
Y:2
K:0
hightlight
#2E2E2E
C:70
M:64
Y:63
K:63
logotype
#444444
C:67
M:60
Y:59
K:44
Color Architecture
Secondary Colors for Light Mode
A structured UI surface palette designed for clear visual separation. Light Neutral Gray (#D4D4D4) organizes dividers and borders, while Medium Gray (#A8A8A8) anchors secondary text and icons. Dark Neutral Gray (#6B6B6B) provides bolder contrast for actionable details without overpowering the clean light mode canvas.
Gray Dividers, borders
#D4D4D4
C:16
M:12
Y:13
K:0
Secondary text, icons
#A8A8A8
C:36
M:29
Y:29
K:0
Subtle emphasis for details
#6B6B6B
C:58
M:50
Y:49
K:17
Color Architecture
Gold gradient in Premium Branding
Engineered to establish luxury and structural depth across premium touchpoints. This precise sequence of six hues interpolates smoothly to construct our signature gold gradient. It is strictly applied to elevate distinct high-value assets, custom iconography, and the primary logomark with sophisticated, dimensional contrast.
#5E5339
C:34
M:53
Y:100
K:17
#F5F5F5
C:3
M:2
Y:2
K:0
#CEAA61
C:70
M:64
Y:63
K:63
#D5B874
C:70
M:64
Y:63
K:63
#746741
C:70
M:64
Y:63
K:63
gold gradient
#AD8F57
C:67
M:60
Y:59
K:44
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #FFFFFF
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 8.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 2.23:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #FFFFFF
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 8.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 2.23:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #FFFFFF
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 8.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 2.23:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #FFFFFF
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 8.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 2.23:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
In Light Mode, our vibrant Gold (#996C00) against crisp white (#FFFFFF) is engineered for maximum clarity. This precise 4.67:1 contrast ratio meets strict WCAG accessibility standards, guaranteeing our primary brand assets are always highly legible and distinct.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our signature Gold (#996C00) on pristine white (#FFFFFF) delivers a precise 4.67:1 contrast ratio. Meeting essential WCAG standards, this deliberate pairing ensures the ALI Agents brand remains distinct, legible, and fully accessible to all users.
WCAG- contrast ratio: 4.67:1
background color #996C00
assets color #ffffff
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Light Mode Contrast Integrity
Our primary dark gray (#2E2E2E) against pristine white (#FFFFFF) delivers an exceptional contrast ratio of 13.58:1. Easily exceeding WCAG accessibility standards, this deliberate pairing ensures a sophisticated, highly legible, and fully inclusive design across all interfaces.
WCAG- contrast ratio: 13.58:1
background color #FFFFFF
assets color #2E2E2E
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Our Dark Mode Gold (#D9A600) paired with a deep black background (#0F0F0F) delivers a strong contrast ratio of 8.58:1. Built on precise design engineering, this combination easily exceeds WCAG standards to guarantee optimal legibility across all dark mode interfaces.
WCAG- contrast ratio: 13.58:1
background color #0F0F0F
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Primary dark gray (#2E2E2E) on Dark Mode Yellow (#D9A600) creates a 6.08:1 contrast ratio. This conditionally passes WCAG standards for large, bold graphics and text.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Dark Mode Contrast Integrity
Layering our Dark Mode Gold (#D9A600) over dark gray backgrounds (#2E2E2E) achieves a 6.08:1 contrast ratio. This pairing successfully creates sophisticated visual depth and passes WCAG standards for structural elements, bold icons, and large headings.
WCAG- contrast ratio: 6.08:1
background color #2E2E2E
assets color #D9A600
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Common Pitfalls
Placing white text (#FFFFFF) against our Dark Mode Yellow (#D9A600) creates a failing contrast ratio of 2.23:1. This pairing must be strictly avoided across all interfaces, as it falls well below WCAG standards and severely compromises legibility for all users.
WCAG- contrast ratio: 6.08:1
background color #D9A600
assets color #FFFFFF
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
WCAG Contrast Standards
Cross-Mode Violations
Placing our Light Mode Gold (#996C00) on a Dark Gray background (#0F0F0F) creates a contrast conflict yielding a ratio of 4.11:1. This environment mismatch fails minimum WCAG standards for regular body text and strains visual accessibility, highlighting why our environment palettes must never be mixed.
WCAG- contrast ratio: 4.11:1
background color #0F0F0F
assets color #996C00
regular text
A high color contrast
makes anything easier to read
pass for 17pt & below
large text
A high color contrast
makes anything easier to read
pass for 18pt & above/14pt bold & above
graphics
for icons and actionable graphics
Typography system
Typography system
Curated Typography
Curated Typography
Plus Jakarta Sans: Authority
For headers and hero banners. Maximize whitespace for clear hierarchy.
Open Sans: Readability
For all body text. Optimize sizing and line spacing.
Saira: Call to Action
For buttons and UI components. Ensure clear internal padding.
The Voice of Authority
Maintain consistent font weights and sizing across platforms.
Never use Plus Jakarta Sans for extended body copy.
Plus Jakarta Sans - Font
Plus Jakarta Sans - Font
The Standard for Readability
Pair bold and italics strategically to emphasize key information
Avoid styling or using excessive font weights in a single paragraph.
Open Sans - Font
Open Sans - Font
The Call to Action
Keep button microcopy concise and action-oriented.
Do not overcrowd buttons with lengthy sentences or multiple directives.
Saira - Font
Saira - Font
The Voice of Authority
Plus Jakarta Sans (Headers & Hero)
Plus Jakarta Sans (Headers & Hero)
These defined hierarchy scales ensure consistent, accessible title structures across the ALI Agents web application.
H1 (Hero / Main Page Title): ExtraBold (800) | 32px | 2.0rem | 24pt
H2 (Section Header): Bold (700) | 24px | 1.5rem | 18pt
H3 (Card/Module Header): SemiBold (600) | 20px | 1.25rem | 15pt
1 Light
Jakarta
2 Light Italic
Jakarta
3 regular
Jakarta
4 italic
Jakarta
5 medium
Jakarta
6 medium italic
Jakarta
7 semibold
Jakarta
8 semibold italic
Jakarta
9 bold
Jakarta
10 bold italic
Jakarta
11 extrabold
Jakarta
12 extrabold italic
Jakarta
The Standard for Readability
Open Sans (Readability)
Open Sans (Readability)
These standard body sizing metrics are optimized for legibility and sustained reading across digital screens.
H4 / Lead Paragraph: SemiBold (600) | 18px | 1.125rem | 13.5pt
Paragraph (Standard Body): Regular (400) | 16px | 1.0rem | 12pt
Small Text (Captions/Footnotes): Regular (400) | 14px | 0.875rem | 10.5pt
1 Light 200
Open Sans
2 Light Italic 200
Open Sans
3 Regular 400
Open Sans
4 Regular Italic 400
Open Sans
5 Bold 700
Open Sans
7 Bold Italic 700
Open Sans
8 Semi Bold 500
Open Sans
9 Semi Bold Italic 500
Open Sans
10 Extra Bold 900
Open Sans
11 Extra Bold Italic 900
Open Sans
THE CALL TO ACTION
Saira Font
(Call to Action)
Saira Font
(Call to Action)
These UI-specific sizing parameters ensure high visibility and accessible tap targets for actionable interface elements.
Large Button / Primary CTA: Bold (700) | 18px | 1.125rem | 13.5pt
Standard Button / Nav Links: SemiBold (600) | 16px | 1.0rem | 12pt
Microcopy / Small Tags: Medium (500) | 12px | 0.75rem | 9pt
1 Light 200
Saira
2 Light Italic 200
Saira
3 Regular 400
Saira
4 Regular Italic 400
Saira
5 Bold 700
Saira
7 Bold Italic 700
Saira
8 Semi Bold 500
Saira
9 Semi Bold Italic 500
Saira
10 Extra Bold 900
Saira
11 Extra Bold Italic 900
Saira
Conclusion and Forward Guidance
Conclusion and Forward Guidance
The Foundation
As we finalize the ALI Agents branding guidelines, we reflect on the principles that anchor our visual and philosophical identity. This document serves as the true compass by which we navigate our brand's presentation, ensuring absolute consistency, clarity, and coherence across every facet of our visual communication.
As we finalize the ALI Agents branding guidelines, we reflect on the principles that anchor our visual and philosophical identity. This document serves as the true compass by which we navigate our brand's presentation, ensuring absolute consistency, clarity, and coherence across every facet of our visual communication.
The Evolution
While these pages outline our foundational framework, they are crafted with the foresight that ALI Agents is an evolving entity. These guidelines are intentionally designed to be scalable, adapting as new platforms emerge and our strategic narrative expands to ensure the brand remains at the forefront of the Web3 industry.
While these pages outline our foundational framework, they are crafted with the foresight that ALI Agents is an evolving entity. These guidelines are intentionally designed to be scalable, adapting as new platforms emerge and our strategic narrative expands to ensure the brand remains at the forefront of the Web3 industry.
The Legacy
We encourage you to apply these guidelines with respect for established standards and a visionary eye toward future evolution. This is not an end, but a vital checkpoint in our journey of design excellence. Here’s to the boundless possibilities that await the ALI Agents brand and its unfolding legacy.
We encourage you to apply these guidelines with respect for established standards and a visionary eye toward future evolution. This is not an end, but a vital checkpoint in our journey of design excellence. Here’s to the boundless possibilities that await the ALI Agents brand and its unfolding legacy.