<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="M5.5 2.07a.5.5 0 0 1 .465.317l.759 1.924 1.924.76a.5.5 0 0 1 0 .93l-1.924.758-.759 1.924a.5.5 0 0 1-.93 0L4.276 6.76 2.352 6a.5.5 0 0 1 0-.93l1.924-.76.759-1.923A.5.5 0 0 1 5.5 2.07m1.602 3.465-.947-.374a.5.5 0 0 1-.282-.281L5.5 3.933l-.373.947a.5.5 0 0 1-.282.281l-.947.374.947.373a.5.5 0 0 1 .282.282l.373.947.373-.947a.5.5 0 0 1 .282-.282zm11.566 13.312A8.503 8.503 0 0 1 12.302 7.57a6.501 6.501 0 1 0 6.366 11.276M13.727 5.09A8.502 8.502 0 0 0 14.97 22a8.49 8.49 0 0 0 6.86-3.48c.524-.715-.293-1.58-1.177-1.53q-.184.01-.37.01a6.5 6.5 0 0 1-5.48-9.998l.008-.012a6.4 6.4 0 0 1 .567-.755C15.775 5.778 15.575 5 14.97 5a9 9 0 0 0-1.221.087zM4.346 9.281a.5.5 0 0 0-.93 0l-.296.75-.75.296a.5.5 0 0 0 0 .93l.75.296.296.75a.5.5 0 0 0 .93 0l.296-.75.75-.296a.5.5 0 0 0 0-.93l-.75-.296zm-.465 1.466q.021.023.045.045a1 1 0 0 0-.045.045 1 1 0 0 0-.045-.045z"/></svg></template>
<script setup lang="ts">
/**
 * NightMode24 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>
