Often, we may require to add a number with a circle around that number. For example, let’s say that we have three steps and we want the numbers to display thus;
① ② ③
All you need do to use Unicode circled numbers is to search the Unicode character table website and then copy the ‘HTML-code’ into the HTML of your webpage. You may then style the character further by using some basic CSS. For example, below is what the circle digit one looks like when I merely insert the HTML into the ‘Text’ editor in WordPress:
①
①
By adding the following inline CSS to the HTML
<span style="font-size: 450%; color: #FF5722;">①</span>
we style the number to look as follows:
①
Simple and so quick! Please leave a comment below if you have found this useful.
This is perfect! Exactly what I needed, after fighting with the CSS for like 10 minutes I thought to find another way, this is simple and effective… Kudos man!
Very easy, much thanks
So helpful … just what I needed. Thank you!
How to get multiple digit numbers inside a circle?