Skip to content
Theme color
Gray color
AppearanceSizeSmall(1)Medium(2)Large(3)Radius
none
small
medium
large
full
Scale90%95%100%105%110%

内置默认图标

Default Icon Library
html
<l-icon name="clear" />
<l-icon name="down" />
<l-icon name="x" />
<l-icon name="success" />
<l-icon name="warning" />
<l-icon name="error" />

注册 SVG 图标库

下面为注册 font-awesome 图标库的例子

Font Awesome
js
import { registerIconLibrary, svgFillAndSizeDefaultMutator } from '@lun/components';

registerIconLibrary({
  library: 'font-awesome',
  type: 'html-url',
  resolver: (name) => {
    const filename = name.replace(/^fa[rbs]-/, '');
    let folder = 'regular';
    if (name.substring(0, 4) === 'fas-') folder = 'solid';
    if (name.substring(0, 4) === 'fab-') folder = 'brands';
    return `https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@5.15.1/svgs/${folder}/${filename}.svg`;
  },
  mutator: (svg) => {
    return svgFillAndSizeDefaultMutator(svg);
  },
});