Style Guide

Upgraded Digital Presence

Typography:

Headers should have key text be black and rest grey. Only capitalize the first word.

Grey = Grey text normal font size

Brown = Darker grey text. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sed nunc vel mauris commodo molestie nec vitae tellus.

Purple = small 16px grey text

Grey bg inside of panel with have margin top and be small 16px text.

Use brown bg to hide text

Use brown quote to hide any content

Panels:

icon
Image only panel
image
icon
Default panel, white bg, large box shadow

Panel status updates:

Needs review

Coming soon

πŸš€
Panel with content (this text won’t show)

Panel Header

Panel sub header

Panel content.

πŸ’‘
This panel will be a white bg with no border or box shadow

This text has a grey bg which will give it a margin top value

icon
panel with no box shadow, white bg, border

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sed nunc vel mauris commodo molestie nec vitae tellus.

icon
panel with no box shadow, transparent bg, border

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In sed nunc vel mauris commodo molestie nec vitae tellus.

πŸ†
Yellow callout is used in roadmap to show any content insdie of the callout and hide everything else. Doesn’t have any call out styling