Style Guide
Typography
| Style/Tag | Font Name | Desktop Size | Mobile Size | Use Cases |
|---|---|---|---|---|
Heading 1 | Brandon Grotesque Black | 40px | 28px | |
Heading 2 | Brandon Grotesque Black | 32px | 24px | |
Heading 3 | Brandon Grotesque Black | 28px | 20px | |
Heading 4 | Brandon Grotesque Black | 24px | 18px | |
Heading 5 | Brandon Grotesque Regular | 24px | 18px | |
Heading 6 | Brandon Grotesque Regular | 18px | 12px | |
| Default Body Text | Arial | 16px | 16px | |
Paragraph Large | Arial | 28px | 24px | |
Paragraph Medium | Arial | 24px | 20px | |
Paragraph Small | Arial | 12px | 12px | |
Stat Heading | Brandon Grotesque Black | 64px | 48px | |
Eyebrow Label
| Arial | 15px | 15px | |
Large Heading | Brandon Grotesque Bold | 40px | 28.8px | |
Quote Heading | Arial Italic | 20px | 16px | |
Quote Attribution | Brandon Grotesque Black | 24px | 24px | |
| Arial | 16px | 16px | |
| Arial | 16px | 16px |
Buttons & Links
| Button Style | Active State | Hover State | Font Color |
|---|---|---|---|
| #0062A5 | #525249 | #FFFFFF | |
| #FAE217 | #525249 | #0062A5, #FFFFFF | |
| #D73C54 | #525249 | #FFFFFF | |
| #94d3eb | #525249 | #0062A5 | |
| #FFFFFF | N/A (transparent) | #0062A5, Flexible | |
| N/A (transparent) | #FFFFFF | Flexible, #0062A5 | |
| #0062A5 | n/a | #0062A5 | |
| #94D3EB | n/a | #94D3EB | |
| #D3D1C3 | n/a | #D3D1C3 | |
| #FFFFFF | n/a | #FFFFFF | |
| #4C4D4F | n/a | #4C4D4F |
VARIABLE COLORS
primary txt:
primary txt
primary bg:
secondary txt:
secondary txt
secondary bg:
tertiary txt:
tertiary txt
tertiary bg:
quaternary txt:
quaternary txt
quaternary bg:
dark txt:
dark txt
light bg:
white txt:
white txt
gray bg:
light txt:
light txt
dark bg:
alt txt:
alt txt
alt bg:
altone txt:
altone txt
altone bg:
alttwo txt:
alttwo txt
alttwo bg:
altthree txt:
altthree txt
altthree bg:
black txt:
black txt
white bg:
white txt:
white txt
black bg:
palette-001 txt:
palette-001 txt
palette-001 bg:
palette-002 txt:
palette-002 txt
palette-002 bg:
palette-003 txt:
palette-003 txt
palette-003 bg:
palette-004 txt:
palette-004 txt
palette-004 bg:
palette-005 txt:
palette-005 txt
palette-005 bg:
palette-006 txt:
palette-006 txt
palette-006 bg:
palette-007 txt:
palette-007 txt
palette-007 bg:
palette-008 txt:
palette-008 txt
palette-008 bg:
palette-009 txt:
palette-009 txt
palette-009 bg:
palette-010 txt:
palette-010 txt
palette-010 bg:
palette-011 txt:
palette-011 txt
palette-011 bg:
palette-012 txt:
palette-012 txt
palette-012 bg:
palette-013 txt:
palette-013 txt
palette-013 bg:
palette-014 txt:
palette-014 txt
palette-014 bg:
palette-015 txt:
palette-015 txt
palette-015 bg:
palette-016 txt:
palette-016 txt
palette-016 bg:
palette-017 txt:
palette-017 txt
palette-017 bg:
palette-018 txt:
palette-018 txt
palette-018 bg:
palette-019 txt:
palette-019 txt
palette-019 bg:
palette-020 txt:
palette-020 txt
palette-020 bg:
palette-021 txt:
palette-021 txt
palette-021 bg:
palette-022 txt:
palette-022 txt
palette-022 bg:
palette-023 txt:
palette-023 txt
palette-023 bg:
palette-024 txt:
palette-024 txt
palette-024 bg:
palette-025 txt:
palette-025 txt
palette-025 bg:
palette-026 txt:
palette-026 txt
palette-026 bg:
palette-027 txt:
palette-027 txt
palette-027 bg:
palette-028 txt:
palette-028 txt
palette-028 bg:
palette-029 txt:
palette-029 txt
palette-029 bg:
palette-030 txt:
palette-030 txt
palette-030 bg:
palette-031 txt:
palette-031 txt
palette-031 bg:
palette-032 txt:
palette-032 txt
palette-032 bg:
palette-033 txt:
palette-033 txt
palette-033 bg:
palette-034 txt:
palette-034 txt
palette-034 bg:
palette-035 txt:
palette-035 txt
palette-035 bg:
palette-036 txt:
palette-036 txt
palette-036 bg:
palette-037 txt:
palette-037 txt
palette-037 bg:
palette-038 txt:
palette-038 txt
palette-038 bg:
palette-039 txt:
palette-039 txt
palette-039 bg:
palette-040 txt:
palette-040 txt
palette-040 bg:
palette-041 txt:
palette-041 txt
palette-041 bg:
palette-042 txt:
palette-042 txt
palette-042 bg:
palette-043 txt:
palette-043 txt
palette-043 bg:
palette-044 txt:
palette-044 txt
palette-044 bg:
palette-045 txt:
palette-045 txt
palette-045 bg:
palette-046 txt:
palette-046 txt
palette-046 bg:
palette-047 txt:
palette-047 txt
palette-047 bg:
palette-048 txt:
palette-048 txt
palette-048 bg:
palette-049 txt:
palette-049 txt
palette-049 bg:
palette-050 txt:
palette-050 txt
palette-050 bg:
palette-051 txt:
palette-051 txt
palette-051 bg:
palette-052 txt:
palette-052 txt
palette-052 bg:
palette-053 txt:
palette-053 txt
palette-053 bg:
palette-054 txt:
palette-054 txt
palette-054 bg:
palette-055 txt:
palette-055 txt
palette-055 bg:
palette-056 txt:
palette-056 txt
palette-056 bg:
palette-057 txt:
palette-057 txt
palette-057 bg:
palette-058 txt:
palette-058 txt
palette-058 bg:
palette-059 txt:
palette-059 txt
palette-059 bg:
palette-060 txt:
palette-060 txt
palette-060 bg:
palette-061 txt:
palette-061 txt
palette-061 bg:
palette-062 txt:
palette-062 txt
palette-062 bg:
palette-063 txt:
palette-063 txt
palette-063 bg:
palette-064 txt:
palette-064 txt
palette-064 bg:
palette-065 txt:
palette-065 txt
palette-065 bg:
palette-066 txt:
palette-066 txt
palette-066 bg:
palette-067 txt:
palette-067 txt
palette-067 bg:
palette-068 txt:
palette-068 txt
palette-068 bg:
palette-069 txt:
palette-069 txt
palette-069 bg:
palette-070 txt:
palette-070 txt
palette-070 bg:
palette-071 txt:
palette-071 txt
palette-071 bg:
palette-072 txt:
palette-072 txt
palette-072 bg:
palette-073 txt:
palette-073 txt
palette-073 bg:
palette-074 txt:
palette-074 txt
palette-074 bg:
palette-075 txt:
palette-075 txt
palette-075 bg:
palette-076 txt:
palette-076 txt
palette-076 bg:
palette-077 txt:
palette-077 txt
palette-077 bg:
palette-078 txt:
palette-078 txt
palette-078 bg:
palette-079 txt:
palette-079 txt
palette-079 bg:
palette-080 txt:
palette-080 txt
palette-080 bg:
palette-081 txt:
palette-081 txt
palette-081 bg:
palette-082 txt:
palette-082 txt
palette-082 bg:
palette-083 txt:
palette-083 txt
palette-083 bg:
palette-084 txt:
palette-084 txt
palette-084 bg:
palette-085 txt:
palette-085 txt
palette-085 bg:
palette-086 txt:
palette-086 txt
palette-086 bg:
palette-087 txt:
palette-087 txt
palette-087 bg:
palette-088 txt:
palette-088 txt
palette-088 bg:
palette-089 txt:
palette-089 txt
palette-089 bg:
palette-090 txt:
palette-090 txt
palette-090 bg:
palette-091 txt:
palette-091 txt
palette-091 bg:
palette-092 txt:
palette-092 txt
palette-092 bg:
palette-093 txt:
palette-093 txt
palette-093 bg:
palette-094 txt:
palette-094 txt
palette-094 bg:
palette-095 txt:
palette-095 txt
palette-095 bg:
palette-096 txt:
palette-096 txt
palette-096 bg:
palette-097 txt:
palette-097 txt
palette-097 bg:
palette-098 txt:
palette-098 txt
palette-098 bg:
palette-099 txt:
palette-099 txt
palette-099 bg:
Icon Library
| Map Pin | Sun | ||
| Home | Signs | ||
| Sphere | Sandals | ||
| Left Quote | Palm Trees | ||
| Left Arrow | Notepad | ||
| Right Arrow | World | ||
| Left Chevron | Calendar | ||
| Right Chevron | Price tag | ||
| Close | User | ||
| Play | Phone | ||
| Search | Envelope | ||
| Menu | Feed | ||
| Minus | |||
| Plus |
Admissions |
||
| Beakers | |||
| Chat | |||
| Checklist | |||
| YouTube | Grad Cap | ||
| beach | Magnifying Glass | ||
| Binoculars | Microscope | ||
| Map | Petri Dish | ||
| Heart | Research Paper | ||
| Global | Timed Calendar | ||
| Glasses | DNA | ||
| Email W/ @ | Housing | ||
| Piggy Bank | Quote Box | ||
| Certificate Circled | Palm Trees Circled | ||
| Globe Circled | Signs Circled | ||
| Tuition | World Travel Plane | ||
| Tag (alt) |
| Syringe | Ambulance | ||
| Heart | Stethoscope | ||
| User 2 | Users | ||
| Pulse | Brain | ||
| Female | Eye | ||
| Microscope | User 3 | ||
| Coin | Cash | ||
| Credit card |
| Location Destination | Navigator | ||
| Scenario Notepad | Microphone | ||
| Mail Message | Searching Magnifying Glass | ||
| Heartbeat | Globe Model | ||
| Chat Question | Chat Love | ||
| Coin bag | Planner | ||
| Finance | Examination | ||
| Palm tree | Group | ||
| Grad Cap | Home | ||
| shield | Books | ||
| Form Signature | Thumbs Up | ||
| Document with Pen | Scroll |