Custom list style with Font Awesome

I frequently use Font Awesome when making website to easily add icons to buttons or within the pages. You can also use Font awesome to make a custom list style. This is a useful website to search for Font awesome icons -> and get the unicode to change the icon. You can change the type of icon in the li:before selector. Just change the value of the content to the unicode number of the icon.

li {
        list-style: none;
        padding-left: 1.2em;
        margin-left: -53px;

            color: #fff;

        content: "f105";
        font-family: 'FontAwesome';
        display: inline-block;
        width: 1.2em;


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )

Connecting to %s