Input

Name Type Description
.Chip
class
.Chip-Content
class

Standard Chip

Icon
Example
<div class="Chip">
  <img
    src="/_astro/chip-image.B8t3eW5H_Z1ecVjN.webp"
    alt="Icon"
    class="Avatar -border-circle"
    width="550"
    height="404"
    loading="lazy"
    decoding="async"
  />
  <div class="Chip-Content">Example</div>
</div>

Alternate Background

Icon
Example
<div class="Chip -color-info">
  <img
    src="/_astro/chip-image.B8t3eW5H_Z1ecVjN.webp"
    alt="Icon"
    class="Avatar -border-circle"
    width="550"
    height="404"
    loading="lazy"
    decoding="async"
  />
  <div class="Chip-Content">Example</div>
</div>

Closeable Chip

Icon
Example
<div class="Chip">
  <img
    src="/_astro/chip-image.B8t3eW5H_Z1ecVjN.webp"
    alt="Icon"
    class="Avatar -border-circle"
    width="550"
    height="404"
    loading="lazy"
    decoding="async"
  />
  <div class="Chip-Content">Example</div> <button class="Button icon -color-info"> <i class="Icon x-lg"></i> </button>
</div>