JS Color Palettes

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',
    },
};