Sticker guidelines
Guidelines for using, creating, and requesting stickers
Using stickers #
Do
- Use stickers to add visual interest and help the user more quickly comprehend a page’s content
- Use the sticker element's
themeandsizeattributes to better match your page styles - Use accessible color combinations
Don't
- Use a sticker in place of an icon
- Alter a sticker's corner roundness or stroke weight
- Set a sticker's color or size in a way other than the
themeandsizeattributes
Creating stickers #
Follow the guidelines below when creating your own stickers for use in a Rivet project.
Sticker style #
Stickers should always have sharp edges/corners and a 2px stroke weight (A) to visually align with IU’s trident and brand fonts. They should always have an IU cream fill.
Sticker size #
Stickers should always be drawn on an 80x80px artboard following a 48x48px grid using keylines (B). The extra clearance space or padding is meant to provide adequate breathing room for the sticker.
Style breakdown of a Rivet sticker shown at a larger-scale for detail (16×).
Size breakdown of a Rivet sticker shown at a larger-scale for detail.
Sticker color #
Stickers come in two primary colors to best align with IU’s brand, Black and Crimson (C). You can change a sticker’s color if intended to be used within a category (D). If you change a stickers’s default colors, they MUST be accessible and within IU’s brand color palette. Visit the color page to check color contrast.
Color breakdown of a Rivet sticker.
Sticker container #
Stickers should always be used within a circular container as designed. Sticker sizes will vary depending on application but should never be used as a main hero image and should generally not exceed 128px if you are using them in a digital format. Standard sticker sizes include 48px, 64px, 80px, 96px, 128px (E).
Container breakdown of a Rivet sticker shown at a larger scale for detail.
Requesting stickers #
Stickers are created by the Design Systems team using the Figma design application. The team has a particular production process to help ensure optimal results for developers and designers.
You may request a sticker, but please read the following notes before submitting your request:
- Check to see if the sticker you’d like to request already exists within Rivet’s sticker library
- If multiple people are requesting the same sticker, it will likely be prioritized over other sticker requests
- Sticker requests are not considered on a rolling basis. Instead, the Design Systems team evaluates all pending sticker requests before each scheduled release. This means that if your sticker request is accepted, it might not appear until a future release.
- The Design Systems team has discretion over which stickers will be added to the library. Requesting a sticker does not guarantee it will be created.