Skip to content

Icon

Icon component powered by Lucide icons via lucide-vue-next.

Open in Storybook

Usage

vue
<script setup>
import { Icon } from '@yellowcard/b2b-design-system';
</script>

<template>
  <Icon name="search" />
  <Icon name="check" size="24" color="#492b7c" />
</template>

Available Icons

The design system uses Lucide icons. Browse the full icon set at lucide.dev.

API Reference

Props

PropTypeDefaultDescription
name*stringLucide icon name
sizestring | numberIcon size in pixels
colorstringIcon color
strokeWidthnumberStroke width