npm i svelte-material-icons<script>
import Check from "svelte-material-icons/Check.svelte";
</script>
<Check {color} {size} {width} {height} {viewBox} />You can search icons at materialdesignicons.com
Icon names are PascalCased from the original name in the site
check-outline converts to CheckOutline.svelte
<script>
export let size = "1em";
export let width = size;
export let height = size;
export let color = "currentColor";
export let viewBox = "0 0 24 24";
</script>
<svg {width} {height} {viewBox}>
<path d="..." fill={color} />
</svg>If you wrap the icon into other element set the display of the parent element to flex
This is a simple source to source compiler that transforms the svg files from https://github.com/Templarian/MaterialDesign to svelte components using cheerio
To develop you can do
git clone https://github.com/ramiroaisen/svelte-material-icons
cd svelte-material-icons
npm i
npm run build