11.3K ·GitHub
What is this?
This is the source repo for Material Design Icons (MDI), a community-driven icon set with 7000+ icons, including Google's official Material Design icons converted into developer-friendly formats.
This is the source repo for Material Design Icons (MDI), a community-driven icon set with 7000+ icons, including Google's official Material Design icons converted into developer-friendly formats.Does it include Google's official icons, or only community-made ones?Both — the repo ships Google's official icon set converted into these formats, plus thousands of icons contributed by the community through the Material Design Icons site.
Both — the repo ships Google's official icon set converted into these formats, plus thousands of icons contributed by the community through the Material Design Icons site.How do I add these icons to my project?Install the npm package that matches your stack: '@mdi/font' for a webfont/SCSS, '@mdi/svg' for raw SVG files and meta.json, '@mdi/js' for JS/TS path strings, or '@mdi/react' for ready-made React components.
Install the npm package that matches your stack: '@mdi/font' for a webfont/SCSS, '@mdi/svg' for raw SVG files and meta.json, '@mdi/js' for JS/TS path strings, or '@mdi/react' for ready-made React components.Do I need npm, or can I just grab the fonts directly?The official distributions (webfont, JS, React, SVG) are all published via npm, but there's also a separate Desktop Font repo for using the icons as a plain system font without any package manager.
The official distributions (webfont, JS, React, SVG) are all published via npm, but there's also a separate Desktop Font repo for using the icons as a plain system font without any package manager.What happens if I skip the Cordova webfont fix after upgrading?In Cordova apps the version query string in the CSS file won't be handled automatically, so you have to manually edit the CSS to remove it after an upgrade, per the migration guide.
In Cordova apps the version query string in the CSS file won't be handled automatically, so you have to manually edit the CSS to remove it after an upgrade, per the migration guide.Which npm packages does the project actually publish?@mdi/font for webfont/SCSS, @mdi/js for JS/TS icon path data, @mdi/react for React components, and @mdi/svg for raw SVG files plus a meta.json index.
@mdi/font for webfont/SCSS, @mdi/js for JS/TS icon path data, @mdi/react for React components, and @mdi/svg for raw SVG files plus a meta.json index.Is there a non-npm way to use the icons, like on desktop?Yes, a separate MaterialDesign-Font distribution repo provides a desktop font version of the icon set for non-web use.
Yes, a separate MaterialDesign-Font distribution repo provides a desktop font version of the icon set for non-web use.What are similar projects?material-design-icons, heroicons, Font-Awesome, material, react-native-ui-kitten, react-icons, simple-icons, tabler
material-design-icons, heroicons, Font-Awesome, material, react-native-ui-kitten, react-icons, simple-icons, tablerWhich topics is it in?webfont, svg-icons, images, bootstrap, fonts, ui-design, icons, material-design, design-system, google, svg, component-library
webfont, svg-icons, images, bootstrap, fonts, ui-design, icons, material-design, design-system, google, svg, component-library