<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="24px" height="24px"><path d="M21.584 7.186a2.5 2.5 0 0 0-1.769-1.768C18.255 5 12 5 12 5s-6.255 0-7.814.418a2.5 2.5 0 0 0-1.768 1.768C2 8.746 2 12 2 12s0 3.255.418 4.814c.23.861.907 1.538 1.768 1.768 1.56.419 7.814.419 7.814.419s6.255 0 7.814-.419a2.5 2.5 0 0 0 1.768-1.768C22 15.255 22 12 22 12s0-3.255-.418-4.814zM10 15V9l5.196 3z"/></svg></template>
<script setup lang="ts">
/**
 * SocialYoutube24 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>
