<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="M8.5 7.5a3.5 3.5 0 1 1 7 0 3.5 3.5 0 0 1-7 0M12 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 0 0 0-11M8.5 14.064a1 1 0 0 0-.836-.076l-3 1.07A1 1 0 0 0 4 16v5a1 1 0 0 0 1 1h14a1 1 0 0 0 1-1v-5a1 1 0 0 0-.664-.942l-3-1.07a1 1 0 0 0-.837.076C14.471 14.66 13.277 15 12 15s-2.47-.34-3.5-.936M6 20v-3.295l1.915-.683C9.142 16.647 10.531 17 12 17s2.858-.353 4.085-.978l1.915.683V20z"/></svg></template>
<script setup lang="ts">
/**
 * Profile24 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>
