@jstnmthw/react-fluentui-emoji/icons/LongDrumIcon.jsx

Fluent Emoji SVG icons for UI react development.

const React = require("react");
const LongDrumIcon = ({ title, titleId, ...props }) => (
  <svg
    width="1em"
    height="1em"
    viewBox="0 0 32 32"
    fill="none"
    xmlns="http://www.w3.org/2000/svg"
    aria-labelledby={titleId}
    {...props}
  >
    {title ? <title id={titleId}>{title}</title> : null}
    <path
      d="M16.1289 20.1092V20.125C16.0903 20.1225 16.0512 20.1199 16.0117 20.1173C15.9722 20.1199 15.9332 20.1225 15.8945 20.125V20.1092C14.1282 19.9833 11.5727 19.6175 8.59766 16.3359C6.76953 14 6.62891 11.3906 6.62891 10.1562V3.5H25.3945V10.1562C25.3945 11.3906 25.2539 14 23.4258 16.3359C20.4507 19.6175 17.8953 19.9833 16.1289 20.1092Z"
      fill="url(#paint0_linear_18_19005)"
    />
    <path
      d="M16.1289 20.1092V20.125C16.0903 20.1225 16.0512 20.1199 16.0117 20.1173C15.9722 20.1199 15.9332 20.1225 15.8945 20.125V20.1092C14.1282 19.9833 11.5727 19.6175 8.59766 16.3359C6.76953 14 6.62891 11.3906 6.62891 10.1562V3.5H25.3945V10.1562C25.3945 11.3906 25.2539 14 23.4258 16.3359C20.4507 19.6175 17.8953 19.9833 16.1289 20.1092Z"
      fill="url(#paint1_radial_18_19005)"
    />
    <path
      d="M16.1289 20.1092V20.125C16.0903 20.1225 16.0512 20.1199 16.0117 20.1173C15.9722 20.1199 15.9332 20.1225 15.8945 20.125V20.1092C14.1282 19.9833 11.5727 19.6175 8.59766 16.3359C6.76953 14 6.62891 11.3906 6.62891 10.1562V3.5H25.3945V10.1562C25.3945 11.3906 25.2539 14 23.4258 16.3359C20.4507 19.6175 17.8953 19.9833 16.1289 20.1092Z"
      fill="url(#paint2_linear_18_19005)"
    />
    <g filter="url(#filter0_i_18_19005)">
      <path
        d="M11.3008 19.4375H20.7226L23.1551 28.955C23.2844 29.461 22.9022 29.9531 22.38 29.9531H9.65758C9.13586 29.9531 8.75374 29.4618 8.88222 28.9561L11.3008 19.4375Z"
        fill="url(#paint3_linear_18_19005)"
      />
      <path
        d="M11.3008 19.4375H20.7226L23.1551 28.955C23.2844 29.461 22.9022 29.9531 22.38 29.9531H9.65758C9.13586 29.9531 8.75374 29.4618 8.88222 28.9561L11.3008 19.4375Z"
        fill="url(#paint4_linear_18_19005)"
      />
    </g>
    <path
      d="M11.3008 19.4375H20.7226L23.1551 28.955C23.2844 29.461 22.9022 29.9531 22.38 29.9531H9.65758C9.13586 29.9531 8.75374 29.4618 8.88222 28.9561L11.3008 19.4375Z"
      fill="url(#paint5_linear_18_19005)"
    />
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M15.5195 19.8125V3.74219H16.5195V19.8125H15.5195Z"
      fill="url(#paint6_radial_18_19005)"
    />
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M15.5195 19.8125V3.74219H16.5195V19.8125H15.5195Z"
      fill="url(#paint7_linear_18_19005)"
    />
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M15.5195 19.8125V3.74219H16.5195V19.8125H15.5195Z"
      fill="url(#paint8_linear_18_19005)"
    />
    <g filter="url(#filter1_i_18_19005)">
      <path
        fillRule="evenodd"
        clipRule="evenodd"
        d="M10.0022 3.82812H11.0022V9.67188C11.0022 12.1304 11.0052 15.6771 14.8271 18.9154L14.1807 19.6784C10.0022 16.1379 10.0022 12.1877 10.0022 9.67722V3.82812Z"
        fill="url(#paint9_linear_18_19005)"
      />
    </g>
    <path
      fillRule="evenodd"
      clipRule="evenodd"
      d="M22.0372 3.82812H21.0372V9.67188C21.0372 12.1304 21.0343 15.6771 17.2123 18.9154L17.8587 19.6784C22.0372 16.1379 22.0372 12.1877 22.0372 9.67722V3.82812Z"
      fill="url(#paint10_linear_18_19005)"
    />
    <rect
      x={5.66016}
      y={2.04688}
      width={20.7188}
      height={1.96875}
      rx={0.984375}
      fill="url(#paint11_linear_18_19005)"
    />
    <rect
      x={5.66016}
      y={2.04688}
      width={20.7188}
      height={1.96875}
      rx={0.984375}
      fill="url(#paint12_radial_18_19005)"
    />
    <rect
      x={10.5664}
      y={18.7109}
      width={10.8672}
      height={1.45312}
      rx={0.726562}
      fill="url(#paint13_linear_18_19005)"
    />
    <rect
      x={10.5664}
      y={18.7109}
      width={10.8672}
      height={1.45312}
      rx={0.726562}
      fill="url(#paint14_radial_18_19005)"
    />
    <rect
      x={10.5664}
      y={18.7109}
      width={10.8672}
      height={1.45312}
      rx={0.726562}
      fill="url(#paint15_radial_18_19005)"
    />
    <defs>
      <filter
        id="filter0_i_18_19005"
        x={8.75718}
        y={18.9375}
        width={14.4232}
        height={11.0156}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dx={-0.1} dy={-0.5} />
        <feGaussianBlur stdDeviation={0.5} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.760784 0 0 0 0 0.458824 0 0 0 0 0.309804 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18_19005"
        />
      </filter>
      <filter
        id="filter1_i_18_19005"
        x={9.9022}
        y={3.82812}
        width={4.92495}
        height={15.9502}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feColorMatrix
          in="SourceAlpha"
          type="matrix"
          values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
          result="hardAlpha"
        />
        <feOffset dx={-0.15} dy={0.1} />
        <feGaussianBlur stdDeviation={0.05} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.270588 0 0 0 0 0.203922 0 0 0 0 0.329412 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18_19005"
        />
      </filter>
      <linearGradient
        id="paint0_linear_18_19005"
        x1={16.0117}
        y1={13.375}
        x2={16.0117}
        y2={20.125}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#BE7846" />
        <stop offset={1} stopColor="#AA5961" />
      </linearGradient>
      <radialGradient
        id="paint1_radial_18_19005"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(21.457 7.375) rotate(90) scale(9.9375 10.0567)"
      >
        <stop offset={0.192} stopColor="#E69F62" />
        <stop offset={1} stopColor="#E69F62" stopOpacity={0} />
      </radialGradient>
      <linearGradient
        id="paint2_linear_18_19005"
        x1={16.0117}
        y1={3.6875}
        x2={16.0117}
        y2={4.625}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#C07041" />
        <stop offset={1} stopColor="#C07041" stopOpacity={0} />
      </linearGradient>
      <linearGradient
        id="paint3_linear_18_19005"
        x1={13.1758}
        y1={26.125}
        x2={20.2383}
        y2={26.125}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#CB8349" />
        <stop offset={0.685841} stopColor="#E7A672" />
      </linearGradient>
      <linearGradient
        id="paint4_linear_18_19005"
        x1={9.36327}
        y1={25.1875}
        x2={12.4258}
        y2={25.9062}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#B17E59" />
        <stop offset={1} stopColor="#BF7D4B" stopOpacity={0} />
      </linearGradient>
      <linearGradient
        id="paint5_linear_18_19005"
        x1={16.5508}
        y1={30.1875}
        x2={16.5508}
        y2={29.1875}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#BF6466" />
        <stop offset={1} stopColor="#BF6466" stopOpacity={0} />
      </linearGradient>
      <radialGradient
        id="paint6_radial_18_19005"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(16.5195 11.5312) rotate(90) scale(11.9063 1.43774)"
      >
        <stop offset={0.237736} stopColor="#4F3965" />
        <stop offset={1} stopColor="#3C1157" />
      </radialGradient>
      <linearGradient
        id="paint7_linear_18_19005"
        x1={15.4805}
        y1={18.7266}
        x2={15.6836}
        y2={18.7266}
        gradientUnits="userSpaceOnUse"
      >
        <stop offset={0.307692} stopColor="#442F54" />
        <stop offset={1} stopColor="#442F54" stopOpacity={0} />
      </linearGradient>
      <linearGradient
        id="paint8_linear_18_19005"
        x1={16.5703}
        y1={19.3438}
        x2={16.3633}
        y2={19.3438}
        gradientUnits="userSpaceOnUse"
      >
        <stop offset={0.222222} stopColor="#5D4F6A" />
        <stop offset={1} stopColor="#5D4F6A" stopOpacity={0} />
      </linearGradient>
      <linearGradient
        id="paint9_linear_18_19005"
        x1={12.4147}
        y1={3.82812}
        x2={12.4147}
        y2={19.0312}
        gradientUnits="userSpaceOnUse"
      >
        <stop offset={0.600346} stopColor="#51455E" />
        <stop offset={1} stopColor="#43255B" />
      </linearGradient>
      <linearGradient
        id="paint10_linear_18_19005"
        x1={19.6248}
        y1={3.82812}
        x2={19.6248}
        y2={19.6784}
        gradientUnits="userSpaceOnUse"
      >
        <stop offset={0.213916} stopColor="#60506B" />
        <stop offset={0.775817} stopColor="#48285C" />
      </linearGradient>
      <linearGradient
        id="paint11_linear_18_19005"
        x1={16.0195}
        y1={2.04687}
        x2={16.0195}
        y2={4.1875}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#E1B177" />
        <stop offset={1} stopColor="#F4AD93" />
      </linearGradient>
      <radialGradient
        id="paint12_radial_18_19005"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(21.082 2.625) rotate(90) scale(1.03125 12.6042)"
      >
        <stop offset={0.212121} stopColor="#FFD8A2" />
        <stop offset={1} stopColor="#FFD8A2" stopOpacity={0} />
      </radialGradient>
      <linearGradient
        id="paint13_linear_18_19005"
        x1={16}
        y1={18.7109}
        x2={16}
        y2={20.1641}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#2B1D37" />
        <stop offset={1} stopColor="#5A316F" />
      </linearGradient>
      <radialGradient
        id="paint14_radial_18_19005"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(18.8164 19.25) rotate(90) scale(0.703125 5.625)"
      >
        <stop offset={0.155556} stopColor="#746681" />
        <stop offset={1} stopColor="#746681" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint15_radial_18_19005"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(10.8008 19.3125) rotate(90) scale(0.851563 6.36841)"
      >
        <stop stopColor="#49454D" />
        <stop offset={1} stopColor="#49454D" stopOpacity={0} />
      </radialGradient>
    </defs>
  </svg>
);
module.exports = LongDrumIcon;