Website Styles

As noted on Typefaces (Fonts), the sans serif typeface for Brandeis University websites is Whitney ScreenSmart. Please contact us for access to Whitney ScreenSmart.

The serif typeface for websites is Merriweather, which can be downloaded from the Google Fonts website.

Heading Styles

Headings use Whitney ScreenSmart in #2f2f2f when not linked and #003478 when linked. The rem sizes below are for the largest screen size.

• H1: 2.625rem, 600 weight
• H2: 2rem, 600 weight
• H3: 1.75rem, 600 weight
• H4: 1.625rem, 400 weight
• H5: 1.375rem, 600 weight
• H6: 1.125rem, 600 weight

Sample Heading 1

Sample Heading 2

Sample Heading 3

Sample Heading 4

Sample Heading 5

Sample Heading 6

Body Text

Body (paragraph) text should be Merriweather. The line height should accommodate body link underlines. Here is a sample body link followed by more body text. You can see that the line of text underneath the link is not crowded against the underline treatment.

Emphasis Body Text

You can create an additional text style using Whitney ScreenSmart in bold weight (600) to make some body text stand out. This is useful for introductory page text. Here is a sample link.

Link Styles

Text links are Brandeis blue (#003478). Links within paragraphs of text (body links) must be distinguishable by more than just the blue link color. They should be in bold weight (600) and underlined with a hover color of #0b7886. Here is a sample body link.

Button Styles

Default Button

Text Button

List Styles

• Lorem ipsum dolor sit amet, consectetur adipisicing elit. Earum dolorem animi expedita!
• Dolorum architecto exercitationem aperiam hic nulla quis, dolore accusamus aut eos! Molestiae.
• Accusamus deserunt officia eum quibusdam, blanditiis obcaecati rem eius tempora voluptatibus aperiam?
• Aspernatur excepturi unde mollitia. Ducimus, nam. Earum eveniet amet corporis vitae est.
• Ex odit totam harum, maxime quos mollitia, veniam cum rem est iure!

 

1. Lorem ipsum dolor sit amet, consectetur adipisicing elit. Voluptatibus itaque odit maiores!
2. Facilis, libero nesciunt, beatae rem harum alias id dolorum quisquam odit assumenda.
3. Odit perferendis fugit dolore enim, accusantium quas perspiciatis delectus tempore eveniet labore.
4. Maxime molestiae ipsum maiores eveniet, cumque et velit aliquam illo quisquam! Animi.
5. Enim blanditiis harum aliquid, aut dignissimos unde eum aperiam eos voluptatem quae.

Table Styles