Was this page helpful? Please submit feedbackopens in new window so we can improve.
The Design System is flexible so you can use as much or as little as you need to for the interface you’re creating. It is compatible with any framework or no framework at all.
The primary uses when building an interface are:
Choose the most appropriate option for what you’re working on to use our visual elements and reusable designs.
In addition, we encourage everyone to follow the guidelines provided for visual elements and reusable designs to inform your own implementation.
In order to use web components and design tokens, you’ll need to link to our stylesheet and two script tags to the <head>.
<link href="https://cdn.jsdelivr.net/npm/@email@example.com/umich-lib.css" rel="stylesheet"/> <script type="module" src="https://cdn.jsdelivr.net/npm/@firstname.lastname@example.org/dist/umich-lib/umich-lib.esm.js"></script> <script nomodule src="https://cdn.jsdelivr.net/npm/@email@example.com/dist/umich-lib/umich-lib.js"></script>
Our overview of web components and design tokens will help you get up to speed if these concepts are new to you.