Sphere Partners

Design System

Sphere Partners

Template parts →

Colors

Primitives

White

white

#ffffff

Black / Neutral

black.50

#f7f8f8

black.100

#ededf1

black.200

#d8dadf

black.300

#b6b9c3

black.400

#8d92a3

black.500

#6f7588

black.600

#5a5f6f

black.700

#494d5b

black.800

#3f424d

black.900

#383a42

black.950

#1f2025

Blue

blue.50

#edf8ff

blue.100

#d7edff

blue.200

#b9e1ff

blue.300

#88d0ff

blue.400

#50b5ff

blue.500

#2893ff

blue.600

#1677ff

blue.700

#0a5ceb

blue.800

#0f4abe

blue.900

#134295

blue.950

#112a5a

Green

green.50

#f2fbf4

green.100

#e1f7e5

green.200

#c4eecc

green.300

#96dfa4

green.400

#61c876

green.500

#3bac52

green.600

#2b8e40

green.700

#257035

green.800

#22592e

green.900

#1d4a28

green.950

#0b2812

Gold & Red (accent)

gold.500

#ffb800

red.500

#ff4d4f

Semantic Tokens

Text

text.white

#ffffff

text.black

#1f2025

text.primary

#1f2025

text.secondary

#6f7588

text.muted

#b6b9c3

text.subtle

#d8dadf

text.blue

#1677ff

text.green

#3bac52

Surface

surface.white

#ffffff

surface.subtleGray

#f7f8f8

surface.mutedGray

#ededf1

surface.disabledGray

#d8dadf

surface.dark

#1f2025

surface.ghostBlue

#edf8ff

surface.ghostGreen

#f2fbf4

Brand

brand.default

#1677ff

brand.hover

#2893ff

brand.pressed

#0a5ceb

brand.disabled

#d8dadf

Status

status.success

#3bac52

status.warning

#ffb800

status.danger

#ff4d4f