Style Guidelines for your Website
The following style guide helps LU websites maintain brand consistency and coherence.
Web Colors
Brand Recognition
An important role of colors in a web design context is brand recognition. Â鶹´«Ã½ websites all use a designated template and have certain colors built into the design. Use of these primary and secondary colors keep with LU branding and should be used as often as possible. LU's primary web colors are red and white with secondary web colors that include black, gold and teal.
Primary Colors
Secondary / Accent Colors
Button Colors
Hover background: #C80E17
Text: #fefefe
Hover background: #01a0af
Text: #fefefe
Hover background: #e8c08c
Text:#fefefe
Hover background: #ffffff 0.8 opacity
Text: 3B3B3B
Hover background: #808080
Text: #fefefe
Hover background: #555555
Text: #fefefe
Hover background: #226D9E
Text: #fefefe
Typography
Font
Body Font Family: Lato, sans-serif
Body Font Size:17.6 px / 16px base, 110%, 1.1rem
Body Font Color: #3B3B3B
Text Links
Light Backgrounds
Link Color: #00626B
Font weight: bold
Text decoration: none
Link Hover Color:#AA3131
Dark Backgrounds
Link Color: #ffffff
Font weight: bold
Text decoration: none
Link Hover Color:#f7e1ad
Headings
H1
Family: Lato
Size: 2.75rem
Color: #000000
H2
Family: Lato
Size: 2.08rem
Color: #000000
H3
Family: Lato
Size: 1.58rem
Color: #000000
Page Type and Layout
The LU template has two page types that consist of rows and columns to produce a layout that is driven by page content.
View basic page layout examples: Full Width Page | Left Navigation Page
Logos and Taglines
Main Â鶹´«Ã½ Website Logo
LU Website Logo with Registered Marks
See For Yourself Campaign
The See For Yourself campaign identity builds on Â鶹´«Ã½’s mission to educate leaders, demonstrate excellence in student learning and career readiness, and pursue research with relevance. The strategic plan pillars of Excellence, Success, Engagement, and Effectiveness are carried throughout.
