oa/documentation/icon-wrap/icon-wrap-colors-documentation.md

Colors

Customize <VIconWrap /> with the color and hasBackground props.
See code for more details about usage.

<template>
  <VFlex
    flex-wrap="wrap"
    align-items="flex-end"
    row-gap=".5rem"
    column-gap=".25rem"
  >
    <VIconWrap icon="lucide:star" color="primary" />
    <VIconWrap icon="lucide:star" color="secondary" />
    <VIconWrap icon="lucide:star" color="success" />
    <VIconWrap icon="lucide:star" color="link" />
    <VIconWrap icon="lucide:star" color="info" />
    <VIconWrap icon="lucide:star" color="warning" />
    <VIconWrap icon="lucide:star" color="danger" />
    <VIconWrap icon="lucide:star" color="black" />
    <VIconWrap icon="lucide:star" color="white" />
  </VFlex>
  <VFlex
    class="mt-4"
    align-items="flex-end"
    column-gap=".25rem"
  >
    <VIconWrap
      icon="lucide:star"
      has-background
      color="primary"
    />
    <VIconWrap
      icon="lucide:star"
      has-background
      color="secondary"
    />
    <VIconWrap
      icon="lucide:star"
      has-background
      color="success"
    />
    <VIconWrap
      icon="lucide:star"
      has-background
      color="link"
    />
    <VIconWrap
      icon="lucide:star"
      has-background
      color="info"
    />
    <VIconWrap
      icon="lucide:star"
      has-background
      color="warning"
    />
    <VIconWrap
      icon="lucide:star"
      has-background
      color="danger"
    />
    <VIconWrap
      icon="lucide:star"
      has-background
      color="black"
    />
    <VIconWrap
      icon="lucide:star"
      has-background
      color="white"
    />
  </VFlex>
</template>