Web Component for Material Design Icons
This is a package that implements material design icons in es6 web components.
npm i mdi-component @mdi/js
Attributes
Attribute | Default | Details |
---|---|---|
path | required if is null | SVG path data. Usually from @mdi/js |
size | inherited | 40px , 1.3rem ... |
horizontal | inexistant | Flip horizontal |
vertical | inexistant | Flip vertical |
rotate | 0 | Degrees 0 to 360 |
color | inherited | rgb() / rgba() / #000 |
spin | inexistant | Spin animation |
Usage
In order to use the attribute path
, the component must be used in an ES6 module. Eg:
HTML
JS (main.js)
;; { super; thisshadow = this; } { thisshadowinnerHTML = ""; const templateEl = document; templateElinnerHTML = thistemplate; thisshadow; } { return ` <mdi-component path="" size="36px" horizontal vertical rotate="45" color="blue" > </mdi-component> `; } customElements;