<template><svg aria-hidden="true" :fill="color" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 48 48" width="48px" height="48px"><path fill-rule="evenodd" d="M18.724 12.404a4.202 4.202 0 1 1 4.205-4.202v4.202zm-7.03 19.207c.462-.69.709-1.502.71-2.333v-4.206H8.202a4.202 4.202 0 1 0 3.492 6.539m4.058-5.306a4.2 4.2 0 0 0-1.23 2.971v10.521a4.202 4.202 0 0 0 8.403 0V29.276a4.202 4.202 0 0 0-7.173-2.971m5.942-10.553a4.2 4.2 0 0 0-2.97-1.23H8.201a4.202 4.202 0 0 0 0 8.403h10.521a4.202 4.202 0 0 0 2.971-7.173m13.902 2.972a4.201 4.201 0 1 1 4.201 4.205h-4.201zm-3.349 2.97a4.2 4.2 0 0 0 1.23-2.97V8.201a4.202 4.202 0 0 0-8.403 0v10.521a4.202 4.202 0 0 0 7.173 2.971m-2.97 13.902a4.201 4.201 0 1 1-4.205 4.201v-4.201zm-2.972-3.349a4.2 4.2 0 0 0 2.971 1.23h10.521a4.202 4.202 0 0 0 0-8.403H29.276a4.202 4.202 0 0 0-2.971 7.173"/></svg></template>
<script setup lang="ts">
/**
 * SocialSlack48 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>
