Icons

You can use the Miro icons by adding class .icon + .icon-eye, eye in this case is the icon name.

html

<div class="icon icon-eye"></div>

Click an icon to copy the classname to your clipboard.

Objects
Symbols
Board objects
Logos

The SVG files are in the ./icons folder inside the NPM package. If you want to use the icon SVG somewhere directly, you can copy the file(s) you need into your project.

For example, if you want to make a header with the arrow-line-shape icon inside of it:

Header

html

<h1 class="h1">
	<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
		<path d="m14.293 8.293-11 11a1 1 0 1 0 1.414 1.414l11-11L18 12l3-9-9 3 2.293 2.293Z" />
	</svg>
	Header
</h1>

css

.h1 svg {
	width: 24px;
	height: 24px;
	display: inline-block;
}

To use icons in your design mockups, check out the Mirotone UI Library on Figma, that includes all icons in the library, and more.