Colours Palette
Our design system is decentralized and built for multi-product purposes. Having different-color naming conventions and numbers etc... makes it harder to maintain it.
For that, we made a decision to give our colours unique names.
Meet the Dragon Ball Z approach.
Each color name is assigned for specific purpose and for each product these values are different.
Please never use Hex values, they won't change if you need theme support.
Main colours
Accent colours
piccolo
hit
Border and line colours
beerus
Background colours
goku
gohan
Text and icon colours
bulma
trunks
Forced colours
goten
popo
Supportive colours
Krillin - Warning colour
krillin - 100
krillin - 60
krillin - 10
Chi Chi - Error colour
chiChi - 100
chiChi - 60
chiChi - 10
Roshi - Success colour
roshi - 100
roshi - 60
roshi - 10
Dodoria
dodoria - 100
dodoria - 60
dodoria - 10
Cell
cell - 100
cell - 60
cell - 10
Raditz
raditz - 100
raditz - 60
raditz - 10
Whis
whis - 100
whis - 60
whis - 10
Frieza
frieza - 100
frieza - 60
frieza - 10
Nappa
nappa - 100
nappa - 60
nappa - 10