Lists

We’ve given 14 types of list designs. Take a look at the information below.


  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.
  • Vestibulum sit amet risus arcu.
  • Etiam ac urna at purus ornare aliquet.
  • Proin nec nibh id mi aliquam laoreet id id metus.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="page-list">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="page-list border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="arrow-circle">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="arrow-circle border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="check-circle">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="check-circle border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="check-square">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="check-square border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="dot-circle">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="dot-circle border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="angle-double">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="angle-double border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="angle">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="angle border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="arrow">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="arrow border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="chevron">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="chevron border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="chevron-circle">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="chevron-circle border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="caret-right">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="caret-right border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="hand">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="hand border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="long-arrow">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="long-arrow border-on">



  • Lorem ipsum dolor sit amet, consectetur adipiscing elit.
  • Sed sed dui sed nisi ullamcorper sagittis ut euismod quam.
  • Donec et euismod ipsum.

In wordpress’ page editor, switch to TEXT mode and add a class to <ul> tag e.g. <ul class="chevron">
and the result would be what you see on the left side.
TO ADD SEPARATOR LINES IN BETWEEN BULLET POINTS
add another class <ul class="chevron border-on">