Rivet Design System
A system for designing and building digital interfaces at IU
Built with plain HTML, CSS, and JavaScript, Rivet helps teams create familiar and accessible experiences across platforms.
Rivet 2 is the latest version of IU's design system. Visit v1.rivet.iu.edu to see the Rivet 1 documentation.
Explore the Rivet design system
-
Layouts
IU-branded starter HTML templates for the design of your website or web application.
-
Components
Modular elements you can combine to create digital interfaces using HTML and CSS.
-
Utilities
CSS classes that can be used to adjust colors, typography, shadows, spacing, and more.
-
Tokens
Basic values used by the design system to represent color, spacing, font sizes, and other visual styles.
-
Design resources
Figma libraries for creating high-fidelity mockups of Rivet interfaces that are more easily translated into browser markup.
-
Tutorials
Beginner-friendly lessons in how to get started using the design system.
“Indiana University offers its users sustainable and consistent experiences with Rivet”
Contribute to Rivet
Visit the Rivet wiki to learn more about:
Get Rivet updates
To get updates about Rivet:
Rivet news
Bookmark the Rivet blog to stay updated.
Rivet 2.4.0 release
Rivet 2.4.0 is now available. This release introduces the horizontal card variant, simplifies tabs markup, and fixes various bugs.
Scott Anthony Murray
Statewide 2023 slide deck
Download the slides from our presentation about Web Components
Scott Anthony Murray
Icon library added to Rivet documentation
The icon library features over 200 SVG icons for use in Rivet projects.
Scott Anthony Murray
Getting help with Rivet
Rivet is a university-wide initiative, overseen by the Enterprise Experience team. To get help with Rivet, email rivet@iu.edu.