Material Icons variants

When using variants of Material Icons, like Outlined for instance, icons won't work because explicitly references 'Material Icons' family font:

.custom-checkbox .custom-control-label::after {
...
font-family: 'Material Icons';
... }

So, when including
<link href="https://fonts.googleapis.com/icon?family=Material+Icons+Outlined" rel="stylesheet">

you should use:

.custom-checkbox .custom-control-label::after {
...
font-family: 'Material Icons', 'Material Icons Outlined';
... }

My proposal is to include all possible variants of https://material.io/resources/icons/ in 'font-family'.

Good point.

I'll try to do it soon.

But I think I'd rather throw Material icons dependencies and switch to pure svg.

Insert a stylesheet like or Outlined or Two Tone or Rounded.

All the stuff will be converted to this icon set.

You can even keep the default markup <i class="material-icons">account_box</i> without using specific ones (like material-icons-sharp).

Tell me if you experience bugs.

@ovicrisan

Navigation Menu