<h1>Checklist</h1>

<ul class="complete">
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>
  
<ul class="incomplete">
  <li>Item 4</li>
  <li>Item 5</li>
  <li>Item 6</li>
</ul>

ul {
  list-style: none;
}

ul.complete li::before {
  content: '🗹 ';
}

ul.incomplete li::before {
  content: '☐ ';
}

/* Other styling elements, that are not necessary for the example */

* {
  font-family: Candara;
}

h1 {
  margin: 2rem 2.5rem;
  font-size: 3rem;
}

ul {
  font-size: 1.7rem;
  margin: 0 auto;
}