Colors

black

black

#080808

white

white.60

#FFFFFF60

white.80

#FFFFFF80

white.90

#FFFFFF90

white

#FFFFFF

amber

amber.50

#FEFAF6

amber.100

#FFF1E0

amber.200

#FFE1BC

amber.300

#FFD198

amber.400

#FFC175

amber.500

#FFB151

amber.600

#FF9614

amber.700

#D67600

amber.800

#985400

amber.900

#5B3200

amber.950

#3D2100

blue

blue.50

#F7F9FD

blue.75

#DEF5FF

blue.100

#CEE6FF

blue.200

#91C6FF

blue.300

#53A7FF

blue.400

#1687FF

blue.500

#0069D8

blue.550

#006D9A

blue.600

#0055AF

blue.700

#004186

blue.800

#002D5E

blue.900

#001A35

blue.950

#001020

blue.95050

#00102050

grey

grey.50

#F8F8FF

grey.100

#E8E8F2

grey.200

#BFBFD2

grey.300

#8989A9

grey.400

#6D6D9D

grey.500

#484867

grey.600

#3B3B55

grey.700

#2F2F43

grey.800

#222231

grey.900

#16161F

grey.950

#0F0F16

red

red.50

#FEF4F5

red.100

#FFD6DA

red.200

#F2B1B8

red.300

#F0838E

red.400

#DE4C5B

red.500

#D62739

red.600

#AB1F2E

red.700

#801722

red.800

#550F17

red.900

#29080B

red.950

#140405

green

green.50

#F0FBF8

green.100

#DAF3EC

green.200

#A8EAD6

green.300

#69C3A8

green.400

#1BA67B

green.500

#008059

green.600

#006C4B

green.700

#00573D

green.800

#00432E

green.900

#002E20

green.950

#002419

purple

purple.50

#EEEFFF

purple.100

#CFD6F0

purple.200

#ACB9E6

purple.300

#9BB0FF

purple.500

#6374B1

purple.950

#2F3343

pink

pink.50

#FEF1FB

pink.300

#FFA7E7

pink.500

#935081

pink.950

#523349

yellow

yellow.50

#FFF4C9

yellow.300

#FFE783

yellow.500

#71673D

yellow.900

#3F3921

blueAlternate

blueAlternate.50

#DEF5FF

Semantic Tokens

base

var(--colors-white) - #FFFFFF

base

var(--colors-white) - #FFFFFF

background

base

var(--colors-grey-500) - #484867

base

var(--colors-grey-500) - #484867

foreground

base

var(--colors-blue-500) - #0069D8

base

var(--colors-blue-500) - #0069D8

primary

base

var(--colors-red-500) - #D62739

base

var(--colors-red-500) - #D62739

error

base

var(--colors-green-500) - #008059

base

var(--colors-green-500) - #008059

success

base

var(--colors-blue-50) - #F7F9FD

base

var(--colors-blue-50) - #F7F9FD

inputBg

base

var(--colors-red-50) - #FEF4F5

base

var(--colors-red-50) - #FEF4F5

inputBgError

base

var(--colors-grey-400) - #6D6D9D

base

var(--colors-grey-400) - #6D6D9D

placeholder

base

var(--colors-grey-300) - #8989A9

base

var(--colors-grey-300) - #8989A9

textFieldIcon

base

var(--colors-red-50) - #FEF4F5

base

var(--colors-red-50) - #FEF4F5

alertDangerBackground

base

var(--colors-red-600) - #AB1F2E

base

var(--colors-red-600) - #AB1F2E

alertDangerTitle

base

var(--colors-red-500) - #D62739

base

var(--colors-red-500) - #D62739

alertDangerSubtitle

base

var(--colors-grey-400) - #6D6D9D

base

var(--colors-grey-400) - #6D6D9D

discreet

base

var(--colors-grey-500) - #484867

base

var(--colors-grey-500) - #484867

accordionTitle

base

linear-gradient(101.08deg, #0069D8 0.37%, #057FFF 100%)

base

linear-gradient(101.08deg, #0069D8 0.37%, #057FFF 100%)

blueGradient

base

linear-gradient(92.69deg, white 0%, var(--colors-grey-50) 98.89%)

base

linear-gradient(92.69deg, white 0%, var(--colors-grey-50) 98.89%)

greyGradient

base

var(--colors-grey-950) - #0F0F16

base

var(--colors-grey-950) - #0F0F16

mapFocusedRidePointBackground

base

var(--colors-white) - #FFFFFF

base

var(--colors-white) - #FFFFFF

mapFocusedRidePointForeground

base

var(--colors-white) - #FFFFFF

base

var(--colors-white) - #FFFFFF

rideCardBackground