Tag

Display a tag element.

Usage

Example
      <template>
  <CTag
    tag="Example"
    color="green"
  />
</template>

    

Icon

Utilise the icon prop (or slot #icon) to add a prepended icon.

Example
      <template>
  <CTag icon="i-heroicons-solid-globe-alt" tag="Example" color="sky" size="sm" />
</template>

    

Color

Utilise the color prop to change the tag colour to one of three options (WIP).

Example
      <template>
  <CTag color="red" tag="Example" />
</template>

    

Size

Example
      <template>
  <CTag size="sm" tag="Example" />
</template>

    

Tag

The tag prop or #default slot can be used to display the tag text.

      <template>
  <CTag />
</template>

    

Props

Prop Default Type
size'lg' "md" | "sm" | "lg" | "xl"
tag string
color'sky' "sky" | "zinc" | "green" | "red" | "indigo" | "fuchsia" | "yellow" | "violet" | "pink" | "teal"
icon string