Colors

Brand colors

Primary brand colors are used for elements that must reflect Marvel’s brand. Each color has a few shades available which are used for a variety of different purposes both within the product and in marketing.

Marvel Dark
Copied!
Marvel
Copied!
Marvel Light
Copied!
Marvel Extra Light
Copied!
Green Dark
Copied!
Green
Copied!
Green Light
Copied!
Green Extra Light
Copied!
Orange
Copied!
Orange Light
Copied!
Orange Extra Light
Copied!
Orange E-Extra Light
Copied!
Yellow
Copied!
Yellow Light
Copied!
Yellow Extra Light
Copied!
Yellow E-Extra Light
Copied!
Purple
Copied!
Purple Light
Copied!
Purple Extra Light
Copied!
Purple E-Extra Light
Copied!
Teal
Copied!
Teal Light
Copied!
Teal Extra Light
Copied!
Teal E-Extra Light
Copied!

Grey colors

Grey colors are used for text, backgrounds, lines and borders. Smoke and Snow have two darker shades, which are used for icons and backgrounds.

Licorice
Copied!
Black
Copied!
Steel
Copied!
Slate
Copied!
Silver
Copied!
Smoke Extra Dark
Copied!
Smoke Dark
Copied!
Smoke
Copied!
Snow Extra Dark
Copied!
Snow Dark
Copied!
Snow
Copied!
White
Copied!

UI Colors

The main UI colors are used for action buttons, alert messages, and form elements. Input fields, for example, can get positive and negative feedback, whereas alert messages can have warning feedback.

Marvel
Copied!
Positive
Copied!
Negative
Copied!
Negative Dark
Copied!