<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="32px" height="32px"><g clip-path="url(#media_thumb-down_32__a)"><path d="M14.605 27.899a3.579 3.579 0 0 1-5.832-4.082l1.563-2.814H6.668a3.668 3.668 0 0 1-3.586-4.434l1.31-6.108.007-.035c.16-.633.295-1.218.44-1.695.147-.487.332-.962.632-1.384.638-.896 1.62-1.304 2.989-1.646q.119-.03.242-.03h8q.163 0 .316.051l2.688.896a1 1 0 0 1 .997-.948h4.667a1 1 0 0 1 .99.851l2 13.333a1.002 1.002 0 0 1-.99 1.149h-6.667q-.058 0-.114-.006zm9.904-20.23h-2.806v11.334h4.506l-1.7-11.333ZM10.785 26.673a1.58 1.58 0 0 0 2.31-.084l6.608-7.625V8.726L16.541 7.67H8.83c-1.203.312-1.541.57-1.73.836-.117.164-.225.399-.348.805-.126.417-.24.912-.414 1.604l-1.301 6.073a1.667 1.667 0 0 0 1.63 2.015h5.368a1 1 0 0 1 .87 1.497l-2.385 4.289a1.58 1.58 0 0 0 .264 1.883Z"/></g><defs><clipPath id="media_thumb-down_32__a"><path fill="#fff" d="M0 0h32v32H0z"/></clipPath></defs></svg></template>
<script setup lang="ts">
/**
 * ThumbDown32 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>
