Design
Principal
De marca
Brand (Compliant)
Secundario
Brand 100 30%
Brand 100 50%
Brand 400
Brand 1000
Banner background options
Brand 1200
Brand 800
Brand 1100
Grays
Gray 25
Gray 2
Gray 100
Texto
Copy - Text Black
Text Grey
Text Disable
De marca
Grape
Teal
Mango
Tangerine
Action Colors
Danger 700
Danger 100
Success 700
Success 100
Warning 700
Warning 100
Information 700
Information 100
Open Sans - Primary Font
Open Sans - Primary Font Bold
Large Hero TextOpen Sans / Bold / 52px / Title Case
Headline 1Open Sans / Bold / 42px / Title Case
Headline 2 Open Sans / Regular / 36px / Title Case
Headline 3Open Sans / Regular / 26px / Title Case
Headline 4Open Sans / Regular / 22px / Title Case
Paragraph Large Open Sans / Regular / 18px / Title Case
Paragraph Open Sans / Regular / 16px / Sentence Case
Paragraph Small Open Sans / Regular / 14px / Sentence Case
UNORDERED LIST
- This is a list item in an unordered list
- An unordered list is a list in which the sequence of items is not important. Sometimes, an unordered list is a bulleted list. And this is a long list item in an unordered list that can wrap onto a new line.
- Lists can be nested inside of each other
- This is a nested list item
- This is another nested list item in an unordered list
- This is the last list item
ORDERED LIST
- This is a list item in an ordered list
- An ordered list is a list in which the sequence of items is important. An ordered list does not necessarily contain sequence characters.
- Lists can be nested inside of each other
- This is a nested list item
- This is another nested list item in an ordered list
- This is the last list item
UNORDERED LIST
- This is a list item in an unordered list
- An unordered list is a list in which the sequence of items is not important. Sometimes, an unordered list is a bulleted list. And this is a long list item in an unordered list that can wrap onto a new line.
- Lists can be nested inside of each other
- This is a nested list item
- This is another nested list item in an unordered list
- This is the last list item
ORDERED LIST
- This is a list item in an ordered list
- An ordered list is a list in which the sequence of items is important. An ordered list does not necessarily contain sequence characters.
- Lists can be nested inside of each other
- This is a nested list item
- This is another nested list item in an ordered list
- This is the last list item
Lorem Ipsum | Label | Short Label | Medium Label |
---|---|---|---|
Lorem Ipsum | Label | Short Label | Medium Label |
Lorem Ipsum | Label | Short Label | Medium Label |
Lorem Ipsum | Label | Short Label | Medium Label |
Lorem Ipsum | Label | Short Label | Medium Label |
Example Error Alert using the icon style with a sample link. Lorem ipsum amet, consectetur adipiscing elit.
Example Warning Alert using the icon style with a sample link. Lorem ipsum amet, consectetur adipiscing elit.
Example Confirmation Alert using the icon style with a sample link. Lorem ipsum amet, consectetur adipiscing elit.
Example Information Alert using the icon style with a sample link. Lorem ipsum amet, consectetur adipiscing elit.