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

Fluent Emoji SVG icons for UI react development.

const React = require("react");
const SmilingFaceWithHeartsIcon = ({ 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 clipPath="url(#clip0_20_194)">
      <path
        d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z"
        fill="url(#paint0_radial_20_194)"
      />
      <path
        d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z"
        fill="url(#paint1_radial_20_194)"
      />
      <path
        d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z"
        fill="url(#paint2_radial_20_194)"
      />
      <path
        d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z"
        fill="url(#paint3_radial_20_194)"
        fillOpacity={0.6}
      />
      <path
        d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z"
        fill="url(#paint4_radial_20_194)"
      />
      <path
        d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z"
        fill="url(#paint5_radial_20_194)"
      />
      <path
        d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z"
        fill="url(#paint6_radial_20_194)"
      />
      <path
        d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z"
        fill="url(#paint7_radial_20_194)"
      />
      <path
        d="M3.00021 1.09997C4.2129 0.740272 5.50009 1.49998 6.00009 1.99998C6.49997 1.50001 8.16818 0.168183 9.75 1.75001C11.0248 3.02476 10.5002 4.99997 9.50015 6.49997C8.91141 7.38308 7.38383 8.7717 6.1531 9.70922C5.50894 10.1999 4.61341 10.0545 4.0674 9.45654C3.14284 8.44398 1.97268 7.14513 1.4001 5.99997C0.400103 3.99997 1.4003 1.57453 3.00021 1.09997Z"
        fill="url(#paint8_linear_20_194)"
      />
      <g opacity={0.5} filter="url(#filter0_f_20_194)">
        <path
          d="M7.5 11.5C7.5 11.5 7.75 9.5 10 9.5C12.25 9.5 12.5 11.5 12.5 11.5"
          stroke="#9A4609"
          strokeWidth={2}
          strokeLinecap="round"
        />
      </g>
      <g opacity={0.5} filter="url(#filter1_f_20_194)">
        <path
          d="M18.5 11.5C18.5 11.5 19 9.5 21 9.5C23 9.5 23.5 11.5 23.5 11.5"
          stroke="#9A4609"
          strokeWidth={2}
          strokeLinecap="round"
        />
      </g>
      <path
        d="M8 11C8 11 8.25 9 10.5 9C12.75 9 13 11 13 11"
        stroke="#43273B"
        strokeWidth={2}
        strokeLinecap="round"
        strokeLinejoin="round"
      />
      <g opacity={0.26} filter="url(#filter2_f_20_194)">
        <path
          d="M8.25 10.75C8.25 10.75 8.5 8.75 10.75 8.75C13 8.75 13.25 10.75 13.25 10.75"
          stroke="white"
          strokeWidth={0.75}
          strokeLinecap="round"
          strokeLinejoin="round"
        />
      </g>
      <path
        d="M19 11C19 11 19.5 9 21.5 9C23.5 9 24 11 24 11"
        stroke="#43273B"
        strokeWidth={2}
        strokeLinecap="round"
        strokeLinejoin="round"
      />
      <g opacity={0.26} filter="url(#filter3_f_20_194)">
        <path
          d="M19.25 10.75C19.25 10.75 19.5 8.75 21.75 8.75C24 8.75 24.25 10.75 24.25 10.75"
          stroke="white"
          strokeWidth={0.75}
          strokeLinecap="round"
          strokeLinejoin="round"
        />
      </g>
      <path
        d="M4.00015 28C2.88205 26.882 2.50013 25 3.50012 24C4.50011 23 6.50007 23.5 6.50007 23.5C6.50007 23.5 7.00015 22.25 8.50015 22.5C10.5002 22.75 10.7502 25 10.2502 26.5C9.8681 27.6462 8.94272 28.8686 8.2707 29.6561C7.83861 30.1624 7.10261 30.2351 6.55273 29.86C5.62817 29.2293 4.3159 28.3157 4.00015 28Z"
        fill="url(#paint9_linear_20_194)"
      />
      <g filter="url(#filter4_f_20_194)">
        <path
          d="M21 18.1C22.5 17.6 24.1667 19 24.5 19.5C24.6667 19 25.4 18 27 18C29 18 27.5571 20.1073 27 21.5C26.3751 23.0622 25.3598 24.9797 24.6859 26.1985C24.355 26.7971 23.5369 26.8749 23.0937 26.354C22.1005 25.1867 20.5722 23.3584 20 22.5C19 21 19.1026 18.7325 21 18.1Z"
          fill="#E4694E"
        />
      </g>
      <path
        d="M23 17.1C24.5 16.6 26.1667 18 26.5 18.5C26.6667 18 27.4 17 29 17C31 17 31.5571 19.1073 31 20.5C30.2698 22.3255 27.94 24.6362 26.736 25.7502C26.3333 26.1228 25.7111 26.0769 25.3546 25.6599C24.3916 24.5336 22.6252 22.4378 22 21.5C21 20 21.1026 17.7325 23 17.1Z"
        fill="url(#paint10_linear_20_194)"
      />
      <path
        d="M12 16C12 17.3333 12.8 20 16 20C19.2 20 20 17.3333 20 16"
        stroke="url(#paint11_radial_20_194)"
        strokeWidth={2}
        strokeLinecap="round"
      />
      <g opacity={0.8} filter="url(#filter5_f_20_194)">
        <path d="M9.5 2.5L7 5" stroke="white" />
      </g>
      <g opacity={0.8} filter="url(#filter6_f_20_194)">
        <path d="M25 18.5L27.5 21.5L29.5 19" stroke="white" />
      </g>
      <g filter="url(#filter7_f_20_194)">
        <circle cx={8.5} cy={24.5} r={1} fill="white" />
      </g>
      <g opacity={0.6} filter="url(#filter8_f_20_194)">
        <path d="M7.5 29.5L9 26" stroke="#F944A5" strokeWidth={2} />
      </g>
      <g filter="url(#filter9_f_20_194)">
        <path d="M26.5 24.5L23 20" stroke="#F944A5" />
      </g>
      <g filter="url(#filter10_f_20_194)">
        <path d="M5.5 8.5L8 6" stroke="#F944A5" />
      </g>
    </g>
    <defs>
      <filter
        id="filter0_f_20_194"
        x={5}
        y={7}
        width={10}
        height={7.00012}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.75}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter1_f_20_194"
        x={15.9998}
        y={7}
        width={10.0005}
        height={7.00024}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.75}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter2_f_20_194"
        x={6.375}
        y={6.875}
        width={8.75}
        height={5.75006}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.75}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter3_f_20_194"
        x={17.375}
        y={6.875}
        width={8.75}
        height={5.75006}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.75}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter4_f_20_194"
        x={17.3735}
        y={15.9938}
        width={12.6526}
        height={12.7068}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={1}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter5_f_20_194"
        x={4.64648}
        y={0.146423}
        width={7.20703}
        height={7.20715}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={1}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter6_f_20_194"
        x={22.616}
        y={16.1799}
        width={9.27441}
        height={8.1106}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={1}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter7_f_20_194"
        x={5.5}
        y={21.5}
        width={6}
        height={6}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={1}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter8_f_20_194"
        x={5.58081}
        y={24.6061}
        width={5.33838}
        height={6.28784}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.5}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter9_f_20_194"
        x={20.6052}
        y={17.6931}
        width={8.28955}
        height={9.11389}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={1}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <filter
        id="filter10_f_20_194"
        x={3.14648}
        y={3.64642}
        width={7.20703}
        height={7.20715}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={1}
          result="effect1_foregroundBlur_20_194"
        />
      </filter>
      <radialGradient
        id="paint0_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(25.5 9) rotate(132.839) scale(37.5033)"
      >
        <stop stopColor="#FFF478" />
        <stop offset={0.474827} stopColor="#FFB02E" />
        <stop offset={1} stopColor="#F70A8D" />
      </radialGradient>
      <radialGradient
        id="paint1_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(25.5 9) rotate(131.878) scale(38.9487)"
      >
        <stop stopColor="#FFF478" />
        <stop offset={0.474827} stopColor="#FFB02E" />
        <stop offset={1} stopColor="#F70A8D" />
      </radialGradient>
      <radialGradient
        id="paint2_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(16 12.5) rotate(101.31) scale(17.8466 22.8581)"
      >
        <stop offset={0.787821} stopColor="#F59639" stopOpacity={0} />
        <stop offset={0.972509} stopColor="#FF7DCE" />
      </radialGradient>
      <radialGradient
        id="paint3_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(18 14) rotate(135) scale(41.0122)"
      >
        <stop offset={0.314853} stopOpacity={0} />
        <stop offset={1} />
      </radialGradient>
      <radialGradient
        id="paint4_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(16 17) rotate(77.692) scale(28.1469)"
      >
        <stop offset={0.507903} stopColor="#7D6133" stopOpacity={0} />
        <stop offset={1} stopColor="#715B32" />
      </radialGradient>
      <radialGradient
        id="paint5_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(16.5 16.5) rotate(55.7131) scale(13.3135 9.65032)"
      >
        <stop stopColor="#FFB849" />
        <stop offset={1} stopColor="#FFB847" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint6_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(20.5 18) rotate(9.86581) scale(11.6726)"
      >
        <stop stopColor="#FFA64B" />
        <stop offset={0.900412} stopColor="#FFAE46" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint7_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(17.5 15) rotate(43.9708) scale(59.0529)"
      >
        <stop offset={0.185425} stopOpacity={0} />
        <stop offset={1} stopOpacity={0.4} />
      </radialGradient>
      <linearGradient
        id="paint8_linear_20_194"
        x1={4.5}
        y1={3.5}
        x2={8.13606}
        y2={8.27701}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#DC2E50" />
        <stop offset={1} stopColor="#F70A8D" />
      </linearGradient>
      <linearGradient
        id="paint9_linear_20_194"
        x1={6}
        y1={24.5}
        x2={9.34217}
        y2={29.9066}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#CA0B4A" />
        <stop offset={1} stopColor="#F70A8D" />
      </linearGradient>
      <linearGradient
        id="paint10_linear_20_194"
        x1={29.0995}
        y1={18.0367}
        x2={25.8756}
        y2={25.428}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#CA0B4A" />
        <stop offset={1} stopColor="#F70A8D" />
      </linearGradient>
      <radialGradient
        id="paint11_radial_20_194"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(16 12) rotate(90) scale(10.5 6.42871)"
      >
        <stop offset={0.555727} stopColor="#584343" />
        <stop offset={0.740289} stopColor="#66525E" />
        <stop offset={1} stopColor="#4E2553" />
        <stop offset={1} stopColor="#522C57" />
      </radialGradient>
      <clipPath id="clip0_20_194">
        <rect width={32} height={32} fill="white" />
      </clipPath>
    </defs>
  </svg>
);
module.exports = SmilingFaceWithHeartsIcon;