• REFERENCE
DESIGN SYSTEM
Every color token, brand hex value, and text style used across this site — collected in one place for consistent reuse.
BRAND ACCENT COLORS
Dark Background
#050508
Cream White
#f5f0e8
Electric Blue
#2563EB
COLOR TOKENS
Grey/Grey 200 | White
Light: rgb(48, 48, 48) · Dark: rgb(255, 255, 255)
Purple | Green
Light: rgb(94, 103, 230) · Dark: rgb(255, 238, 112)
White | Dark
Light: rgb(255, 255, 255) · Dark: rgb(48, 48, 48)
BG/Theme White | Dark
Light: rgb(255, 255, 255) · Dark: rgb(26, 26, 27)
Grey/Grey 100
Light: rgb(218, 218, 218) · Dark: rgb(92, 92, 92)
Grey/Grey 150
Light: rgb(143, 143, 143) · Dark: rgb(181, 181, 181)
Red
rgb(255, 34, 68)
Nav/Nav BG Color
Light: rgba(255, 255, 255, 0.9) · Dark: rgba(15, 15, 15, 0.9)
Nav/Nav Border Color
Light: rgb(218, 218, 218) · Dark: rgb(15, 15, 15)
Green
rgb(11, 222, 102)
Grey/Grey 50 | Dark
Light: rgb(245, 245, 245) · Dark: rgb(51, 51, 51)
404/404 Color Dodge
Light: rgb(0, 0, 0) · Dark: rgb(227, 175, 32)
404/404 Soft Light
Light: rgb(143, 143, 143) · Dark: rgb(212, 212, 212)
Loading Circle
Light: rgba(255, 255, 255, 0) · Dark: rgb(15, 15, 15)
Black
rgb(0, 0, 0)
White
rgb(255, 255, 255)
Primary Blue
rgb(20, 110, 245)
Cream white
rgb(232, 224, 208)
TYPOGRAPHY
Headings/Heading 1
Heading One — Aa Bb Cc
Headings/Heading 2
Heading Two — Aa Bb Cc
Headings/Heading 3
Heading Three — Aa Bb Cc
Headings/Heading 4
Heading Four — Aa Bb Cc
Paragraphs/Body Large
Body Large — The quick brown fox jumps over the lazy dog.
Paragraphs/Body Medium
Body Medium — The quick brown fox jumps over the lazy dog.
Paragraphs/Body Small
Body Small — The quick brown fox jumps over the lazy dog.
Paragraphs/Body Medium Bold
Body Medium Bold — The quick brown fox jumps over.
Paragraphs/Body Small Bold
Body Small Bold — The quick brown fox jumps over.
UI/Nav Link
Nav Link — Home / About / Projects
LINK STYLES
Footer Link
Footer Link Underline