Component and pattern variations
Many WDS components and patterns offer variations from which to choose. Variants include differences in color, texture, width, and alignment. If a component has a variant, you will be able to use the component viewer to preview it.
Backgrounds, colors, and textures
Torch components offer several pattern variants with different background colors and textures. When a background variant is available for a pattern, it can be previewed in the component library using the component viewer. These color and texture variants may be used to provide accents, highlights, and pops of color to pages.
Patterns with orange backgrounds add splashes of color to the page. Pattern variants with other background colors and textures break up white space on a page and create visual interest, highlights, and points of focus for users.
Another creative way to bring additional color variation and interest to pages is to use photography with orange highlights in patterns with media components.
Specific considerations
- Overall, UT-branded websites should maintain a light, bright appearance.
- Use patterns with dark gray backgrounds rarely to add contrast or highlight important information.
- Limit the use of textured variants to no more than three per page. Do not use the same variant on adjacent patterns.
- Pattern variants with dot textures should be used sparingly. Please do not alter the size of the dot texture.
- Patterns with similar background textures (such as the dot texture) should not be stacked or clustered together on a page.
- Use no more than three full-width orange bar variants on a single page (preferably fewer). Insert other patterns between them to maintain visual separation and distinctness.
- Monotone (grayscale) photo background variants should be used only once per page.