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

Fluent Emoji SVG icons for UI react development.

const React = require("react");
const MusicalNoteIcon = ({ 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}
    <g filter="url(#filter0_ii_18_18060)">
      <path
        d="M29.478 3.09959C29.478 2.3774 28.8447 1.81881 28.1282 1.90898L11.493 4.00238C10.893 4.07789 10.4429 4.58818 10.4429 5.19299V24.4911H14.5874V10.0216C14.5874 9.51764 14.9625 9.0924 15.4625 9.02947L24.2086 7.92883C24.8058 7.85369 25.3335 8.31918 25.3335 8.92101V20.8036H29.478V3.09959Z"
        fill="url(#paint0_linear_18_18060)"
      />
    </g>
    <path
      d="M29.478 3.09959C29.478 2.3774 28.8447 1.81881 28.1282 1.90898L11.493 4.00238C10.893 4.07789 10.4429 4.58818 10.4429 5.19299V24.4911H14.5874V10.0216C14.5874 9.51764 14.9625 9.0924 15.4625 9.02947L24.2086 7.92883C24.8058 7.85369 25.3335 8.31918 25.3335 8.92101V20.8036H29.478V3.09959Z"
      fill="url(#paint1_linear_18_18060)"
    />
    <path
      d="M29.478 3.09959C29.478 2.3774 28.8447 1.81881 28.1282 1.90898L11.493 4.00238C10.893 4.07789 10.4429 4.58818 10.4429 5.19299V24.4911H14.5874V10.0216C14.5874 9.51764 14.9625 9.0924 15.4625 9.02947L24.2086 7.92883C24.8058 7.85369 25.3335 8.31918 25.3335 8.92101V20.8036H29.478V3.09959Z"
      fill="url(#paint2_radial_18_18060)"
    />
    <path
      d="M29.478 3.09959C29.478 2.3774 28.8447 1.81881 28.1282 1.90898L11.493 4.00238C10.893 4.07789 10.4429 4.58818 10.4429 5.19299V24.4911H14.5874V10.0216C14.5874 9.51764 14.9625 9.0924 15.4625 9.02947L24.2086 7.92883C24.8058 7.85369 25.3335 8.31918 25.3335 8.92101V20.8036H29.478V3.09959Z"
      fill="url(#paint3_radial_18_18060)"
    />
    <path
      d="M29.478 3.09959C29.478 2.3774 28.8447 1.81881 28.1282 1.90898L11.493 4.00238C10.893 4.07789 10.4429 4.58818 10.4429 5.19299V24.4911H14.5874V10.0216C14.5874 9.51764 14.9625 9.0924 15.4625 9.02947L24.2086 7.92883C24.8058 7.85369 25.3335 8.31918 25.3335 8.92101V20.8036H29.478V3.09959Z"
      fill="url(#paint4_radial_18_18060)"
    />
    <circle
      cx={8.646}
      cy={24.1592}
      r={5.94141}
      fill="url(#paint5_radial_18_18060)"
    />
    <circle
      cx={8.646}
      cy={24.1592}
      r={5.94141}
      fill="url(#paint6_radial_18_18060)"
    />
    <circle
      cx={8.646}
      cy={24.1592}
      r={5.94141}
      fill="url(#paint7_radial_18_18060)"
    />
    <circle
      cx={8.646}
      cy={24.1592}
      r={5.94141}
      fill="url(#paint8_radial_18_18060)"
    />
    <circle
      cx={8.646}
      cy={24.1592}
      r={5.94141}
      fill="url(#paint9_radial_18_18060)"
    />
    <circle
      cx={23.5366}
      cy={20.7686}
      r={5.94141}
      fill="url(#paint10_radial_18_18060)"
    />
    <circle
      cx={23.5366}
      cy={20.7686}
      r={5.94141}
      fill="url(#paint11_radial_18_18060)"
    />
    <circle
      cx={23.5366}
      cy={20.7686}
      r={5.94141}
      fill="url(#paint12_radial_18_18060)"
    />
    <circle
      cx={23.5366}
      cy={20.7686}
      r={5.94141}
      fill="url(#paint13_radial_18_18060)"
    />
    <defs>
      <filter
        id="filter0_ii_18_18060"
        x={9.69287}
        y={1.89941}
        width={20.5352}
        height={23.3416}
        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={1} dy={1} />
        <feGaussianBlur stdDeviation={0.375} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.235294 0 0 0 0 0.211765 0 0 0 0 0.266667 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18_18060"
        />
        <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={-1} />
        <feGaussianBlur stdDeviation={0.375} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.317647 0 0 0 0 0.298039 0 0 0 0 0.341176 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="effect1_innerShadow_18_18060"
          result="effect2_innerShadow_18_18060"
        />
      </filter>
      <linearGradient
        id="paint0_linear_18_18060"
        x1={19.9604}
        y1={8.18482}
        x2={19.9604}
        y2={24.4911}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#473B53" />
        <stop offset={1} stopColor="#433D4A" />
      </linearGradient>
      <linearGradient
        id="paint1_linear_18_18060"
        x1={10.3107}
        y1={17.3205}
        x2={11.5366}
        y2={17.3205}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#7E7C80" />
        <stop offset={1} stopColor="#39373D" stopOpacity={0} />
      </linearGradient>
      <radialGradient
        id="paint2_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(29.2047 2.22084) rotate(137.021) scale(2.3405 0.716969)"
      >
        <stop stopColor="#635A6D" />
        <stop offset={1} stopColor="#635A6D" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint3_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(27.3179 17.2656) rotate(-51.1467) scale(1.44461 4.28044)"
      >
        <stop offset={0.582086} stopColor="#535254" />
        <stop offset={1} stopColor="#535254" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint4_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(12.4741 20.3906) rotate(-47.1211) scale(1.49258 4.0639)"
      >
        <stop offset={0.381918} stopColor="#4F4D50" />
        <stop offset={1} stopColor="#4F4D50" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint5_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(8.646 29.5001) rotate(-90) scale(6.75 9.28125)"
      >
        <stop stopColor="#442B58" />
        <stop offset={1} stopColor="#38353B" />
      </radialGradient>
      <radialGradient
        id="paint6_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(11.7397 22.5001) rotate(130.389) scale(5.49787)"
      >
        <stop stopColor="#5A585C" />
        <stop offset={1} stopColor="#5A585C" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint7_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(10.8647 24.6251) rotate(-169.765) scale(9.14552 9.40265)"
      >
        <stop offset={0.619372} stopColor="#5C5C5C" stopOpacity={0} />
        <stop offset={1} stopColor="#828282" />
      </radialGradient>
      <radialGradient
        id="paint8_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(7.29747 24.1592) scale(8.19062 10.8866)"
      >
        <stop offset={0.796178} stopColor="#575658" stopOpacity={0} />
        <stop offset={0.955414} stopColor="#575658" />
      </radialGradient>
      <radialGradient
        id="paint9_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(8.646 23.5883) rotate(90) scale(6.75342 6.8464)"
      >
        <stop offset={0.880531} stopColor="#64487C" stopOpacity={0} />
        <stop offset={1} stopColor="#64487C" />
      </radialGradient>
      <radialGradient
        id="paint10_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(23.5366 26.1094) rotate(-90) scale(6.75 9.28125)"
      >
        <stop offset={0.162324} stopColor="#442B58" />
        <stop offset={1} stopColor="#38353B" />
      </radialGradient>
      <radialGradient
        id="paint11_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(27.8335 19.2188) rotate(139.445) scale(6.27234 5.45698)"
      >
        <stop stopColor="#5F5F60" />
        <stop offset={1} stopColor="#5F5F60" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint12_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(22.1881 20.7686) scale(8.19062 10.8866)"
      >
        <stop offset={0.796178} stopColor="#575658" stopOpacity={0} />
        <stop offset={0.955414} stopColor="#575658" />
      </radialGradient>
      <radialGradient
        id="paint13_radial_18_18060"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(23.5366 20.1977) rotate(90) scale(6.75342 6.8464)"
      >
        <stop offset={0.880531} stopColor="#64487C" stopOpacity={0} />
        <stop offset={1} stopColor="#64487C" />
      </radialGradient>
    </defs>
  </svg>
);
module.exports = MusicalNoteIcon;