<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path fill-rule="evenodd" d="M12 4a8 8 0 1 0 0 16h.973c.732 0 1.007-.958.386-1.346-1.894-1.184-1.641-4.018.433-4.848l5.58-2.232c.415-.166.578-.511.539-.775A8 8 0 0 0 12 4M2 12C2 6.477 6.477 2 12 2c5.014 0 9.165 3.69 9.888 8.502.204 1.354-.67 2.488-1.774 2.93l-5.58 2.231a.729.729 0 0 0-.115 1.295C16.744 18.41 15.714 22 12.973 22H12C6.477 22 2 17.523 2 12m6-3.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1M6.5 9a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0m.25 4.5a.5.5 0 1 1 1 0 .5.5 0 0 1-1 0m.5-1.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3M12 6.5a.5.5 0 1 0 0 1 .5.5 0 0 0 0-1m-1.5.5a1.5 1.5 0 1 1 3 0 1.5 1.5 0 0 1-3 0m5 2a.5.5 0 1 1 1 0 .5.5 0 0 1-1 0m.5-1.5a1.5 1.5 0 1 0 0 3 1.5 1.5 0 0 0 0-3"/></svg></template>
<script setup lang="ts">
/**
 * Palette24 is an SVG icon wrapped in a Vue component to make it easier to use.
 */
withDefaults(
  defineProps<{
    /**
     * Define the color of the icon.
     */
    color?: string;
  }>(),
  {
    color: 'currentColor',
  },
);
</script>
