materialdesignicons-vue3

Icons from materialdesignicons.com rendered as PascalCase vue components with Mdi prefix.
1,579 2
Install
npm install materialdesignicons-vue3
Latest Version:0.9.0
Vue:3
License:MIT
Last Updated:Sep 3, 2026
Links: GitHub  ·  npm
Maintainer: prochor666

Material design icons for Vue 3

Icons from materialdesignicons.com rendered as PascalCase vue components with Mdi prefix.

Icon source: materialdesignicons.com

How to (with Tailwind CSS)

<template>
    <p>
        <MdiAbacus class="w-4 h-4 inline text-rose-400" /> Hello world
        <MdiFormatBold class="w-4 h-4 inline text-rose-400" /> Hello world
    </p>
</tempalte>

<script setup>
import {
    MdiAbacus,
    MdiFormatBold,
} from 'materialdesignicons-vue3/icons';
</script>

How to build your own

You need Python 3 installed

Commands

This command will clone source Git repository.

sync

This command creates vue components.

build

This command will clear the source directory. Use it before production.

cleanup

Linux & Mac

cd build
chmod +x *.sh
./sync.sh
./build.sh
./cleanup.sh

Windows

cd build
sync.cmd
build.cmd
cleanup.cmd

Related Packages

ant-design-icons

Ant Design Icons 是一套提取自 Ant Design 的高质量图标,你可以自由地在 React、Vue...

5,284 53
@paratus-medical/paratus-icons

PARATUS SVG icon library

3,055
@scarlab-icons/vue

A set of free MIT-licensed Vue components with SVG icons.

949 17
@iconoir/vue

Vue library for Iconoir, the biggest open source icon library with tons of free...

56,973 4,600
@64mb/gravity-ui-icons-vue

Pack of Gravity UI icons for Vue

2,046 1

Version History

Version Released Vue License
0.9.0 >= 3 MIT
0.8.0 >= 3 MIT
0.7.0 >= 3 MIT
0.6.0 >= 3 MIT
0.5.1 >= 3 MIT