STYLE GUIDE
BRIDGEWATER
STUDIO
Colors
Primary
Secondary
Tertiary
Dark Grey
Light Grey
Typography
Roboto
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
0123456789
Petrona
abcdefghijklmnopqrstuvwxyz
ABCDEFGHIJKLMNOPQRSTUVWXYZ
0123456789
H1
One main header describes the page topic.
H2
SECONDARY HEADERS FOR PAGE SECTIONS.
H3
TERTIARY HEADERS FOR SUB-SECTIONS.
H4
ACCENT HEADERS ARE SMALL
Body / Paragraph
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a nisl a ipsum convallis consequat. Integer id felis a libero finibus convallis. Aenean consequat quam blandit luctus rhoncus. Curabitur in lobortis turpis.
Lists:
- Item 1
- Item 2
- Item 3
- Item A
- Item B
- Item C
Blockquote
“Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a nisl a ipsum convallis consequat. Integer id felis a libero finibus convallis. Aenean consequat quam blandit luctus rhoncus. Curabitur in lobortis turpis.”
Large Text
LOREM IPSUM DOLOR SIT AMET, CONSECTUR ADIPISCING ELIT. PELLENTESQUE A NISL A IPSUM CONVALLIS.
Link Text
When a link appears in copy, it will look like clickable text so it is clear.
Micro Text
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque a nisl a ipsum convallis consequat. Integer id felis a libero finibus convallis. Aenean consequat quam blandit luctus rhoncus. Curabitur in lobortis turpis.
Buttons
Small
Images
Blue Tone - for page headers
Full Color - for finished projects
Black & White - for team, process and facility
Desaturated - alt for team, process and facility
Dark Grey - for team, process and facility with copy overlay
