Style Guide
Search…
Icon Lists
Icon lists add visual interest and quick visual cues to longer blocks of text.

Usage of Icon Lists

Icon lists are unordered lists with a line icon component placed to the left.

Anatomy of Icon Lists

Icon lists use iconography to give the most accurate visual representation of the information on the list.
1. Label Icon Font Awesome (a-icon-line) is used for the label icon.
font-awesome
font-size: 16px
font-weight: light
font-color: slate-dark
padding-left: 16px
padding-right: 8px
padding-top: 16px
padding-bottom: 16px
font-awesome codes:
[home-alt] - used for Home Cleaning professionals
[tools] - used for Handyman professionals
[lightbulb] - used for Electrician professionals
[map-marker-alt] - used for location
[badge-check] - used for years on platform
[user-shield] - used for background-check
2. Text (a-text-paragraph)
font-weight: book
font-size: 16px
font-color: slate-dark
padding-left: 8px
padding-right: 16px
padding-top: 16px
padding-bottom: 16px
Last modified 2yr ago
Copy link
On this page
Usage of Icon Lists
Anatomy of Icon Lists