JS Color Palettes
All colors used in the Design System are provided below, for use in JavaScript:
Blue Theme
The blue
theme is used on the following products:
- GumGum Dashboard
- GumGum Dental
- GumGum Dental Uploader (demo tool)
const palette = {
"blue": {
"primary": "#00a7cf",
"secondary": "#ffb819",
"tertiary": "#00c4b4",
"success": "#00c4b4",
"info": "#555387",
"warning": "#ffb819",
"danger": "#ff5a34",
"blue": "#00a7cf",
"gold": "#ffb819",
"green": "#00c4b4",
"orange": "#ff6c0c",
"purple": "#555387",
"red": "#ff5a34",
"darkBlue": "#0085a5",
"darkGold": "#e5a516",
"darkGreen": "#3fae2a",
"darkRed": "#e5512e"
}
};
Green Theme
The green
theme is used on the following products:
- GumGum Publisher Manager
- GumGum Publisher Center
const palette = {
"green": {
"primary": "#00c4b4",
"secondary": "#ff5a34",
"tertiary": "#00a7cf",
"success": "#00c4b4",
"info": "#555387",
"warning": "#ffb819",
"danger": "#ff5a34",
"blue": "#00a7cf",
"gold": "#ffb819",
"green": "#00c4b4",
"orange": "#ff6c0c",
"purple": "#555387",
"red": "#ff5a34",
"darkBlue": "#0085a5",
"darkGold": "#e5a516",
"darkGreen": "#3fae2a",
"darkRed": "#e5512e"
}
};
Purple Theme
The purple
theme is used on the following products:
- GumGum Demo Manager
const palette = {
"purple": {
"primary": "#555387",
"secondary": "#00a7cf",
"tertiary": "#ff5a34",
"success": "#00c4b4",
"info": "#555387",
"warning": "#ffb819",
"danger": "#ff5a34",
"blue": "#00a7cf",
"gold": "#ffb819",
"green": "#00c4b4",
"orange": "#ff6c0c",
"purple": "#555387",
"red": "#ff5a34",
"darkBlue": "#0085a5",
"darkGold": "#e5a516",
"darkGreen": "#3fae2a",
"darkRed": "#e5512e"
}
};
VI Theme
The vi
theme (originally named for GumGum Visual Intelligence) is used on the following products:
- GumGum Sports Media Value Center
- GumGum Sports Scoreboard
- GumGum Sports Uploader (demo tool)
const palette = {
"vi": {
"primary": "#00c4b4",
"secondary": "#ff5a34",
"tertiary": "#00a7cf",
"success": "#3fae2a",
"info": "#555387",
"warning": "#ffb819",
"danger": "#e5512e",
"blue": "#00a7cf",
"gold": "#ffb819",
"green": "#00c4b4",
"orange": "#ff6c0c",
"purple": "#555387",
"red": "#ff5a34",
"darkBlue": "#0085a5",
"darkGold": "#e5a516",
"darkGreen": "#3fae2a",
"darkRed": "#e5512e"
}
};