html
<script src="https://cdn.jsdelivr.net/npm/@iconify/icons-loader@2.x.x/dist/browser/iconify.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/@iron-icons/-icons@2.x.x/iron-icons/iron-icons.css">
html
<iron-icon icon="icons:home"></iron-icon>
html
<link rel="stylesheet" href="path/to/custom-icons.css">
html
<iron-icon icon="custom-icons:custom-icon"></iron-icon>
css
.my-icon {
color: red;
}
.my-icon iron-icon {
--iron-icon-fill-color: blue;
width: 24px;
height: 24px;
}
html
<iron-icon class="my-icon" icon="icons:home"></iron-icon>
html
<iron-icon icon="icons:home" @click="${handleClick}"></iron-icon>
<script>
function handleClick() {
}
</script>
html
<iron-iconset-svg name="my-icons" size="24">
</iron-iconset-svg>
