carbon icons svelte

carbono-icons-velte

Sistema de diseño de carbono Los iconos SVG como componentes esbeltos.

Esta biblioteca de iconos de dependencia cero construye íconos del sistema de diseño de carbono como componentes de Svelte. Aunque mejor combinado con componentes de carbono-SVelte, estos íconos se pueden consumir independientemente.

Pruébelo en el esbelto repl.

Vista previa · ícono índice

Instalación

 # npm
npm i carbon-icons-svelte

# pnpm
pnpm i carbon-icons-svelte

# Yarn
yarn add carbon-icons-svelte

# Bun
bun add carbon-icons-svelte

Uso

Básico

Importe el icono de la carpeta carbon-icons-svelte/lib . Consulte el índice de iconos para una lista de iconos compatibles.

< script >
  import Add from " carbon-icons-svelte/lib/Add.svelte " ;
</ script >

< Add />

Tamaño personalizado

Use el accesorio size para especificar el tamaño del icono.

Los tamaños de icono compatibles incluyen 16 , 20 , 24 y 32 .

El tamaño predeterminado es 16 .

< Add size ={ 16 } />
< Add size ={ 20 } />
< Add size ={ 24 } />
< Add size ={ 32 } />

Accesorios personalizados

$$restProps se envía al elemento svg .

Puede usar fill para personalizar el color o pasar cualquier otro atributo svg válido al componente.

< Add fill = " red " class = " icon " />

Etiquetado

< Add aria-label = " Add " />

Icono etiquetado que se puede enfocar

< Add aria-label = " Add " tabindex = " 0 " />

Etiquetado por

< label id = " add-file " >Add file</ label >

< Add aria-labelledby = " add-file " />

API

Accesorios

Todos los accesorios son opcionales.

Nombre	Tipo	Valor predeterminado
tamaño	16 | 20 | 24 | 32	16
título	string	undefined

Colegio de cambios

Que contribuye

Licencia

Apache 2.0