How to use checkmark or tick instead of bullet in unordered list?

Use checkmark or tick instead of bullet

I had a list where I wanted to sow tick/checkmark (✓) instead of bullets in the unordered list. For this, I used following code.

ul {
  list-style: none;
}
ul li:before {
  content: '\2714\0020';
}

But text is not aligned, instead it was appearing like following.

To make text aligned and get same as of with bullets, I gave margin-left to the li tag as following.

margin-left: -38px;

And got following output.

That’s it.