U-M LIBRARY
Universal Header
The Universal Header shows users that they are on a U-M Library website and provides a quick and organized way for users to access other library websites.
PREVIEW
U-M LIBRARY
<​m-universal-header​>​</​m-universal-header​>

When to use this component
You must use the Universal Header at the top of every page of your website if it hosted with the lib.umich.edu domain.
When not to use this component
If your website is not being hosted on lib.umich.edu.
Used by
Research
During Fall 2020 usability testing:
View the research plan (Google Doc)
View the research findings (Google Slides)
If you found a mistake on this page, would you kindly submit a fix?
Get started
You can start using the Web Components and design tokens immediately by adding this stylesheet and these script tags to the <head>:
<link href​=​"​https://unpkg.com/@umich-lib/css@v1/dist/umich-lib.css​" rel="stylesheet"/>
<script type="module" src​=​"​https://unpkg.com/@umich-lib/components@v1/dist/umich-lib/umich-lib.esm.js​"​>​</​script​>
<script nomodule src​=​"​https://unpkg.com/@umich-lib/components@v1/dist/umich-lib/umich-lib.js​"​>​</​script​>

Use this design system across any framework or no framework at all. We accomplish this by using standardized web platform APIs. We love HTML, CSS, and JavaScript.
UNIVERSITY OF MICHIGAN LIBRARY
913 S. University Avenue
Ann Arbor, MI 48109
WEB COMPONENTS
Chat
Universal Header
Website Header
RESOURCES
Design tokens
Updates
Support
Accessibility
© 2020, Regents of the University of Michigan
Built with the U-M Library Design System, Eleventy, and Github.
WelcomeChatUniversal HeaderWebsite HeaderDesign tokensSupportUpdates