Introduction Modules Flavors Customization Quick Reference  Github
Core Grid Navigation Input Control Table Card Tab Contextual Progress Utility

Utility

The utility module contains all the utilities and helper classes that you might want when designing a website or application. They solve common design problems efficiently and provide you with generic rules you can easily apply everywhere.

All examples showcased refer to the mini-default flavor, some class names and styles might differ based on the flavor you're using.

Quick overview

Every website or app has different needs and no CSS framework can predict them all. The utility module addresses this issue by providing you with a handful of utility and helper classes to make common, repetitive declarations easier. These classes include, but are not limited to, generic border styling and shadows, some responsive sizing and spacing utilities and a few other things, like a close icon, breadcrumbs styling and visiblity helpers for screen readers.


Quick start

To use the utility module, simply include the link to the flavor you are using and start writing your HTML page as usual. One suggestion we will make is to add the following line inside your HTML page's <head> to utilize the viewport meta tag:


<meta name="viewport" content="width=device-width, initial-scale=1">

If you want to learn more about customizing mini.css, go back to the customization page or choose a module from the top menu to see its documentation.