0.0.13 • Published 2 years ago
st-lucide v0.0.13
Stencil Lucide
Lucide icons as StencilJS components.
Installation
There are three strategies we recommend for using web components built with Stencil.
Script tag
- Put a script tag similar to this
<script src='https://unpkg.com/st-lucide@latest/dist/st-lucide/st-lucide.esm.js'></script>
in the head of your index.html - Then you can use the element anywhere in your template, JSX, html lucide
Node Modules
- Run
npm install st-lucide --save
- Put a script tag similar to this
<script src='node_modules/st-lucide/dist/st-lucide/st-lucide.esm.js'></script>
in the head of your index.html - Then you can use the element anywhere in your template, JSX, html etc
In a stencil-starter app
- Run
npm install st-lucide --save
- Add an import to the npm packages
import st-lucide;
- Then you can use the element anywhere in your template, JSX, html etc
Usage
Icons can be used as web components, by prefixing the name of the icon with icon-
. See lucide.dev for a complete list of icons.
<icon-activity />
Any attributes will be forwarded to the lucide svg icon.
<icon-activity stroke-width="1" color="red" />