Latest icon fonts and CSS for self-hosting material design icons.
APACHE-2.0 License
Bot releases are visible (Hide)
Published by marella about 3 years ago
mi
, mi-outlined
, mi-round
, mi-sharp
, mi-two-tone
. You can use material-icons
, material-icons-outlined
, material-icons-round
, material-icons-sharp
, material-icons-two-tone
classes insteadmaterial-icons()
Sass mixin. You can use @extend .material-icons;
instead of @include material-icons();
eot
, ttf
and otf
font files and renamed other font files (0.7.0)$material-icons-font-name
, $material-icons-font-family
Sass variables (0.7.0)The core features have remained same since 0.2.x. Addition (0.5.0) and removal (0.7.0) of font files don't require any code changes if you are just importing the provided CSS or Sass files. Since new fonts are added (0.5.0), you may want to look at reducing build size.
Published by marella over 3 years ago
interpreter_mode
, playlist_add_check_circle
, playlist_add_circle
, south_america
, vaccines
iconsPublished by marella over 3 years ago
::
for CSS pseudo-elementsPublished by marella over 3 years ago
switch_access_shortcut
, switch_access_shortcut_add
iconsPublished by marella over 3 years ago
Published by marella over 3 years ago
eot
font files as they are only required for IE6-8ttf
and otf
font files as woff2
and woff
font files should be enough for modern browsersMaterialIconsOutlined-Regular
→ material-icons-outlined
)$material-icons-font-name
, $material-icons-font-family
)local()
font references in css as they may cause issues with locally installed fontsfiles
field to package.json
to include only css, scss and font files in packagedart-sass
as node-sass
is deprecatedairline_stops
, airlines
, apps_outage
, browser_updated
, connecting_airports
, expand_circle_down
, flight_class
, interests
, mode_of_travel
, soup_kitchen
iconsPublished by marella over 3 years ago
co2
, comments_disabled
, gif_box
, group_remove
, workspace_premium
iconsPublished by marella over 3 years ago
Published by marella over 3 years ago
Published by marella over 3 years ago
To display outlined, round, sharp and two tone icons, use:
<span class="mi-outlined mi-home"></span>
<span class="mi-round mi-home"></span>
<span class="mi-sharp mi-home"></span>
<span class="mi-two-tone mi-home"></span>
Published by marella over 3 years ago
font-display: block
(#21)Published by marella over 3 years ago
Published by marella over 3 years ago
Published by marella over 3 years ago
Published by marella almost 4 years ago
Published by marella almost 4 years ago
ttf
file for normal icons and otf
file for outlined, round, sharp and two tone iconsPublished by marella almost 4 years ago
To display outlined, round, sharp and two tone icons, use:
<span class="material-icons-outlined">home</span>
<span class="material-icons-round">home</span>
<span class="material-icons-sharp">home</span>
<span class="material-icons-two-tone">home</span>