Typography
Fonts and colors are set in the Customizer. Sizes are set in Core Framework.
Headline XL
Headline H1
Looks H1
Headline H2
Looks H2
Headline H3
Looks H3
Headline H4
Looks H4
Headline H5
Looks H5
Headline H6
Looks H6
This is 2XL-size text (text-2xl). Morbi ac felis. Duis leo. Morbi vestibulum volutpat enim.
This is XL-size text (text-xl). Nunc nonummy metus. In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Proin magna. Fusce vel dui.
This is L-size text (text-l). Pellentesque posuere. Pellentesque egestas, neque sit amet convallis pulvinar, justo nulla eleifend augue, ac auctor orci leo non est. Suspendisse eu ligula.
This is M-size text (text-m), which is the base text size.
This is S-size text (text-s). Nulla sit amet est. Vestibulum rutrum, mi nec elementum vehicula, eros quam gravida nisl, id fringilla neque ante vel mi. Maecenas vestibulum mollis diam.
This is XS-size text (text-xs). Nullam sagittis. In consectetuer turpis ut velit. Duis leo.
This is a paragraph. Paragraph styling comes from the Body typography settings. This is a link. Style me please — including hover/focus states. Nunc ut sem vitae risus tristique posuere.
- I am a bulleted list.
- Check out my bullety listiness. It’s brilliant.
- My list is better than your list.
- Check one.
- Check two.
- Check three.
- Check yourself before you wreck yourself.
I am a blockquote. “Do. Or do not. There is no try.”
Form
Colors
| Colour | Contrast #222222 | Contrast 2 #575760 | Contrast 3 #b2b2be | Base #f0f0f0 | Base 2 #f7f8f9 | Base 3 #ffffff | Accent #1e73be |
|---|---|---|---|---|---|---|---|
| Contrast #222222 | 7.6 : 1 | 14.0 : 1 | 15.0 : 1 | 15.9 : 1 | |||
| Contrast 2 #575760 | 6.3 : 1 | 6.7 : 1 | 7.1 : 1 | ||||
| Contrast 3 #b2b2be | 7.6 : 1 | ||||||
| Base #f0f0f0 | 14.0 : 1 | 6.3 : 1 | |||||
| Base 2 #f7f8f9 | 15.0 : 1 | 6.7 : 1 | 4.6 : 1 | ||||
| Base 3 #ffffff | 15.9 : 1 | 7.1 : 1 | 4.9 : 1 | ||||
| Accent #1e73be | 4.6 : 1 | 4.9 : 1 |