List

 

  • Lorem ipsum
  • Dolor sit
  • Amet consectetur
  • Adipiscing elit
  • Integer nec odio
  • Praesent libero

Custom shape, background, text colors

 

  • Lorem ipsum
  • Dolor sit
  • Amet consectetur
  • Adipiscing elit
  • Integer nec odio
  • Praesent libero

Shape only

 

  • Lorem ipsum
  • Dolor sit
  • Amet consectetur
  • Adipiscing elit
  • Integer nec odio
  • Praesent libero

Custom shapes

 

  • Integer nec odio
  • Amet consectetur
  • Adipiscing elit
  • Lorem ipsum
  • Dolor sit
  • Praesent libero

Defaults and overrides

Use defaults for the entire list, override for specific icons:

  • shape

  • shape color

  • background color

 

  • Lorem ipsum
  • Amet consectetur
  • Adipiscing elit
  • Integer nec odio
  • Dolor sit
  • Praesent libero

Margins on each side

Note: the background color is not part of the list, it was only added to make the margins visible.

 

  • Lorem ipsum
  • Dolor sit
  • Amet consectetur
  • Adipiscing elit
  • Integer nec odio
  • Praesent libero

Indented list

These are two separate lists below, with the bottom one having custom margins.

 

  • Lorem ipsum
  • Dolor sit
  • Amet consectetur
  • Adipiscing elit
  • Integer nec odio
  • Praesent libero

Space between icon and text

 

  • Lorem ipsum
  • Dolor sit
  • Amet consectetur
  • Adipiscing elit
  • Integer nec odio
  • Praesent libero

Space between lines

 

  • Lorem ipsum
  • Dolor sit
  • Amet consectetur
  • Adipiscing elit
  • Integer nec odio
  • Praesent libero

Line break example

 

  • Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer nec odio. Praesent libero. Sed cursus ante dapibus diam. Sed nisi. Nulla quis sem at nibh elementum imperdiet.
  • Dolor sit