<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" width="20px" height="20px"><path fill-rule="evenodd" d="M8.333 3.25A1.75 1.75 0 0 0 6.583 5v5a.75.75 0 0 1-.315.611 3.417 3.417 0 1 0 4.13 0 .75.75 0 0 1-.315-.611V5a1.75 1.75 0 0 0-1.75-1.75m4.917 10.083c0-1.47-.646-2.789-1.667-3.689V5a3.25 3.25 0 0 0-6.5 0v4.644a4.917 4.917 0 1 0 8.167 3.69m.5-10.083a.5.5 0 0 0 0 1h2.5a.5.5 0 1 0 0-1zm-.5 3.417a.5.5 0 0 1 .5-.5h2.5a.5.5 0 1 1 0 1h-2.5a.5.5 0 0 1-.5-.5m.5 2.416a.5.5 0 0 0 0 1h2.5a.5.5 0 1 0 0-1zM9.083 11.3V6.667h-1.5V11.3a2.167 2.167 0 1 0 1.5 0"/></svg></template>
<script setup lang="ts">
/**
 * Temperature20 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>
