Colors
By changing the color of the text with these utility classes, you can convey different meanings to users.Utilities Overview
SOM Digital Guidelines includes CSS utility classes to reuse in your projects. These utility classes provide a quick and easy way to apply common styles without having to write new CSS code or modify existing component styles. They also allow developers to create consistent and modular styles that can be easily maintained and updated over time.
Display
Display utilities let you change the display value of components and other features, and have support for both common values and print display.Flex
Use flex elements to change a component's alignment, sizing, and layout. Note: You may need to implement custom CSS for more intricate applications.Grid
Create layouts of various shapes and sizes by employing a 12-column system with a comprehensive set of responsive grid utilities.Screenreaders
Screenreader utilities improve accessibility by hiding elements on all devices, save for screenreaders.Sizing
Use the height and width utilities to make elements about as wide and as tall as their parents.Spacing
These utility classes modify an element's appearance by adjusting its margins and padding.Table
Use table utilities to easily add styles and effects to tables.Text
Use these classes to modify text utilities alignment, weight, style, and more.