[element-name]
Element description and link to figma component
Usage
Install Package
npm i cmds-component-icons
Use as an Svelte Component
Import the component
import Element from 'cm-icon-{name}.svelte';
Add the component
<Element fill="currentcolor" width="100%">...your content</Element>
Tailwind styles will work as long as you add the package folder to the tailwind config
Use as a Custom Element API
Copy this code inside the head tag
<link rel="stylesheet" href="cmds-preset.css" />
<script src="cm-icon-{name}.js" />
Use the custom element
<cm-icon-{name} fill="currentcolor" width="100%"></cm-icon-{name}>
To use it in a JS file use
document.body.innerHTML =
'<cm-icon-{name} fill="currentcolor" width="100%"></cm-icon-{name}>';
Custom element does not suppor external css classes
Attributes
- fill: use CSS valid color values
- width: use CSS valid units
Events
none