Display countless countable things
Stats sections in our products come in several shapes:
All Stats sections are 3 column layouts, styled in various ways.
They can be used to show numbers in a bold way. For example, projects, clients, or number of users or follwers.
Basic Stats are made up of three columns separated with a subtle border. You can customise the text and background styles.
On mobile, the columns stack vertically, and the no-border-on-mobile class removes the separators.
Example
Having centered text in a Stats section requires more work than just centering text (paddings, widths), so we provide a stand-alone variation for that. It might not look very different, but if you want centered stats, this variation will save you some headaches.
Example
This Stats section uses the same layout for the columns and separators, but it uses a background image instead of a solid colour. Of course, the background image works in all versions of Outlook, as well as in Windows 10 Mail.
Example
Two column Stats section, with a background colour on each column.
Example
Similar to the Boxed Stats, but with a background image and a semi-transparent background colour for the actual boxes. Although the background image is supported in Outlook and Windows 10 Mail, the semi-transparent box background colour is coded with rgba CSS, and will fallback to a solid colour where it is not supported.
Example
You can easily change the looks of a Stats section: