In general, web copy and multimedia will follow all brand standards including tone, writing style, and visual style.
Any exceptions specific to web platforms are noted here.
Text Alignment
Text is typically left-aligned, unless it’s within a specific block that is built for centered text. These centered blocks include:
- CTA Panel
- Hero Panel
- Justified Feature / CTA Grid
- Panel
If center-alignment is used, the content should be short with 40 words max.
Text Styles
The main font is Poppins, which is used for both headings and main body text. This is a Google Fonts (https://fonts.google.com/specimen/Poppins) and available in Adobe Font Kits (https://fonts.adobe.com/fonts/poppins).
Pre-set headings styles must be applied consistently and appropriately to meet accessibility standards.
Do not use in-line HTML to alter the text styles.
Body text is always left-aligned. Most headings are also left-aligned, unless an H2 is center-aligned as a call-out accent.
All font style values are default/normal unless noted otherwise. The root font-size is 16px.
Style | Font Size | Font Weight | Line Height | Color |
H1 | 67px (4.1875rem) | 400 | 0.88 | WSU Purple |
H2 | 40px (2.5rem) | 300 | 1.1 | WSU Purple |
H3 | 40px (2.5rem) | 500 | 1.125 | WSU Purple |
H4 | 18px (1.125rem) | 700 | 1.5 | WSU Purple |
H5 | 16px (1rem) | 500 | 1.437 | WSU Purple |
Intro Text | 28px (1.75rem) | 500 | 1.25 | WSU Purple |
Paragraph (Body)Text | 18px (1.125rem) | 400 | 1.5 | Black |
Small Text | 15px (0.9375rem) | Normal | 1.4 | WSU Purple |
Colors
In Feature Panel, Button, Click-to-Action Grid blocks, the text and background colors may be reversed to meet accessibility standards.
Sample | Name | Hex | RGB | Type | Usage |
| Dark Purple | 3C0680 | 60, 6, 128 | Primary | Global Header & Footer |
| WSU Purple | 4B08A1 | 75, 8, 161 | Primary | Site Header & Footer H1-H5 Page Background (Reverse) Call-Out Blocks (Background) Linked Text Color |
| Light Purple | 8456BE | 132, 86, 190 | Accent |
|
| Aqua | 8FD8CD | 143, 216, 205 | Accent | Icon Art Line Art “Squiggles” |
| Blue | 3C71B8 | 60, 113, 184 | Accent |
|
| Green | 7BA21B | 123, 162, 27 | Accent | Call-Out Blocks (Background) Accent Text (Reverse Background) Linked Text Color (Reverse Background) |
| Lime | C7DE34 | 199, 222, 52 | Accent | Icon Background Line Art “Squiggles” |
| Orange | ED4C25 | 237, 76, 37 | Accent | Icon Background |
| Yellow | FFC214 | 255, 194, 20 | Alert |
|
| Light Grey | F1F2F3 | 241, 242, 243 | Accent | Call-Out Blocks (Hover Background Alternative) Caption Background |
| Grey | 979797 | 151, 151, 151 | Accent |
|
| Black | 000000 | 0, 0, 0 | Primary | Body Text |
| White | FFFFFF | 255, 255, 255 | Primary |
|