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

Fluent Emoji SVG icons for UI react development.

const React = require("react");
const PenIcon = ({ 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_i_18_22342)">
      <rect
        width={1.28638}
        height={3.33302}
        rx={0.643191}
        transform="matrix(0.728253 0.685309 -0.689201 0.724571 4.5401 26.3418)"
        fill="#827E85"
      />
      <rect
        width={1.28638}
        height={3.33302}
        rx={0.643191}
        transform="matrix(0.728253 0.685309 -0.689201 0.724571 4.5401 26.3418)"
        fill="url(#paint0_radial_18_22342)"
      />
    </g>
    <g filter="url(#filter1_i_18_22342)">
      <path
        d="M28.2448 6.86169L29.1151 7.68662C29.7297 8.26914 29.7406 9.24456 29.1391 9.84065L24.3011 14.6357"
        stroke="#FFD350"
        strokeWidth={1.4}
        strokeLinecap="round"
      />
    </g>
    <g filter="url(#filter2_f_18_22342)">
      <path
        d="M28.4948 6.77295L29.3651 7.59787C29.9797 8.1804 29.9906 9.15582 29.3891 9.7519L24.5511 14.547"
        stroke="url(#paint1_linear_18_22342)"
        strokeWidth={0.45}
        strokeLinecap="round"
      />
    </g>
    <g filter="url(#filter3_ii_18_22342)">
      <path
        d="M9.19177 17.1845C6.72302 20.8057 5.25948 23.3648 4.5199 24.5978L7.19177 27.4729C8.34802 26.7684 12.2101 24.4723 14.6136 22.8416C19.3324 19.6401 23.0355 15.1953 24.5355 12.9573C25.4596 11.5785 27.6477 8.4707 29.2472 6.16347C29.9551 5.14235 29.7826 3.76251 28.8543 2.93435C28.0191 2.18932 26.7891 2.09028 25.8634 2.72054C23.1096 4.59536 18.6959 7.76858 16.5668 9.38278C15.0772 10.5121 11.3871 13.9645 9.19177 17.1845Z"
        fill="#2E71B9"
      />
    </g>
    <path
      d="M9.19177 17.1845C6.72302 20.8057 5.25948 23.3648 4.5199 24.5978L7.19177 27.4729C8.34802 26.7684 12.2101 24.4723 14.6136 22.8416C19.3324 19.6401 23.0355 15.1953 24.5355 12.9573C25.4596 11.5785 27.6477 8.4707 29.2472 6.16347C29.9551 5.14235 29.7826 3.76251 28.8543 2.93435C28.0191 2.18932 26.7891 2.09028 25.8634 2.72054C23.1096 4.59536 18.6959 7.76858 16.5668 9.38278C15.0772 10.5121 11.3871 13.9645 9.19177 17.1845Z"
      fill="url(#paint2_radial_18_22342)"
    />
    <path
      d="M9.19177 17.1845C6.72302 20.8057 5.25948 23.3648 4.5199 24.5978L7.19177 27.4729C8.34802 26.7684 12.2101 24.4723 14.6136 22.8416C19.3324 19.6401 23.0355 15.1953 24.5355 12.9573C25.4596 11.5785 27.6477 8.4707 29.2472 6.16347C29.9551 5.14235 29.7826 3.76251 28.8543 2.93435C28.0191 2.18932 26.7891 2.09028 25.8634 2.72054C23.1096 4.59536 18.6959 7.76858 16.5668 9.38278C15.0772 10.5121 11.3871 13.9645 9.19177 17.1845Z"
      fill="url(#paint3_radial_18_22342)"
    />
    <g filter="url(#filter4_i_18_22342)">
      <path
        d="M7.58475 27.0647L4.75777 24.3907C4.66678 24.3047 4.5195 24.3223 4.45165 24.4274L3.58841 25.7647C3.10291 26.5168 3.23674 27.508 3.90454 28.106C4.5174 28.6549 5.42317 28.7294 6.11835 28.2881L7.55451 27.3766C7.66403 27.3071 7.67889 27.1538 7.58475 27.0647Z"
        fill="#DCAC34"
      />
    </g>
    <g filter="url(#filter5_f_18_22342)">
      <rect
        x={28.0188}
        y={3.25696}
        width={1.40518}
        height={29.5511}
        rx={0.702589}
        transform="rotate(45 28.0188 3.25696)"
        fill="url(#paint4_linear_18_22342)"
      />
    </g>
    <path
      d="M28.2708 7.84321L24.1295 3.681C24.0404 3.59153 24.0555 3.443 24.1607 3.37325L24.8111 2.942C24.9691 2.83722 25.179 2.85778 25.3137 2.99124L28.9869 6.63105C29.1238 6.76667 29.1445 6.98058 29.0362 7.13995L28.578 7.81453C28.5074 7.91852 28.3594 7.93232 28.2708 7.84321Z"
      fill="url(#paint5_radial_18_22342)"
    />
    <path
      d="M28.2708 7.84321L24.1295 3.681C24.0404 3.59153 24.0555 3.443 24.1607 3.37325L24.8111 2.942C24.9691 2.83722 25.179 2.85778 25.3137 2.99124L28.9869 6.63105C29.1238 6.76667 29.1445 6.98058 29.0362 7.13995L28.578 7.81453C28.5074 7.91852 28.3594 7.93232 28.2708 7.84321Z"
      fill="url(#paint6_linear_18_22342)"
    />
    <path
      d="M17.9292 20.1228L11.8532 14.0057C11.7619 13.9137 11.7559 13.7672 11.8415 13.6699C12.2922 13.1578 13.0494 12.3626 13.5168 11.8789C13.6132 11.779 13.7722 11.7778 13.8709 11.8754L20.1448 18.0716C20.2467 18.1723 20.2436 18.3377 20.1376 18.4342C19.5909 18.9319 18.7686 19.6814 18.2747 20.1317C18.1757 20.2219 18.0236 20.2179 17.9292 20.1228Z"
      fill="url(#paint7_radial_18_22342)"
    />
    <path
      d="M17.9292 20.1228L11.8532 14.0057C11.7619 13.9137 11.7559 13.7672 11.8415 13.6699C12.2922 13.1578 13.0494 12.3626 13.5168 11.8789C13.6132 11.779 13.7722 11.7778 13.8709 11.8754L20.1448 18.0716C20.2467 18.1723 20.2436 18.3377 20.1376 18.4342C19.5909 18.9319 18.7686 19.6814 18.2747 20.1317C18.1757 20.2219 18.0236 20.2179 17.9292 20.1228Z"
      fill="url(#paint8_linear_18_22342)"
    />
    <path
      d="M17.9292 20.1228L11.8532 14.0057C11.7619 13.9137 11.7559 13.7672 11.8415 13.6699C12.2922 13.1578 13.0494 12.3626 13.5168 11.8789C13.6132 11.779 13.7722 11.7778 13.8709 11.8754L20.1448 18.0716C20.2467 18.1723 20.2436 18.3377 20.1376 18.4342C19.5909 18.9319 18.7686 19.6814 18.2747 20.1317C18.1757 20.2219 18.0236 20.2179 17.9292 20.1228Z"
      fill="url(#paint9_linear_18_22342)"
    />
    <defs>
      <filter
        id="filter0_i_18_22342"
        x={2.50977}
        y={26.2072}
        width={2.70036}
        height={3.16587}
        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 dy={-0.4} />
        <feGaussianBlur stdDeviation={0.2} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.462745 0 0 0 0 0.384314 0 0 0 0 0.541176 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18_22342"
        />
      </filter>
      <filter
        id="filter1_i_18_22342"
        x={23.6012}
        y={6.16174}
        width={6.98205}
        height={9.17395}
        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.3} />
        <feGaussianBlur stdDeviation={0.375} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.803922 0 0 0 0 0.6 0 0 0 0 0.227451 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18_22342"
        />
      </filter>
      <filter
        id="filter2_f_18_22342"
        x={23.8761}
        y={6.09797}
        width={6.63207}
        height={9.124}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={0.225}
          result="effect1_foregroundBlur_18_22342"
        />
      </filter>
      <filter
        id="filter3_ii_18_22342"
        x={3.5199}
        y={1.30505}
        width={26.6626}
        height={26.6678}
        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={1} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.223529 0 0 0 0 0.384314 0 0 0 0 0.74902 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18_22342"
        />
        <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.5} 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.341176 0 0 0 0 0.458824 0 0 0 0 0.635294 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="effect1_innerShadow_18_22342"
          result="effect2_innerShadow_18_22342"
        />
      </filter>
      <filter
        id="filter4_i_18_22342"
        x={3.29761}
        y={24.0859}
        width={4.34933}
        height={4.48865}
        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 dy={-0.25} />
        <feGaussianBlur stdDeviation={0.375} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.737255 0 0 0 0 0.545098 0 0 0 0 0.458824 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18_22342"
        />
      </filter>
      <filter
        id="filter5_f_18_22342"
        x={5.91402}
        y={2.04797}
        width={24.3074}
        height={24.3074}
        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_18_22342"
        />
      </filter>
      <radialGradient
        id="paint0_radial_18_22342"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(0.642884 1.41143) rotate(89.9909) scale(1.92159 0.34546)"
      >
        <stop offset={0.215421} stopColor="#8C8492" />
        <stop offset={1} stopColor="#8C8492" stopOpacity={0} />
      </radialGradient>
      <linearGradient
        id="paint1_linear_18_22342"
        x1={29.8332}
        y1={7.33621}
        x2={27.4418}
        y2={9.96121}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#FFED6F" />
        <stop offset={1} stopColor="#FFED6F" stopOpacity={0} />
      </linearGradient>
      <radialGradient
        id="paint2_radial_18_22342"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(26.624 5.64206) rotate(136.273) scale(1.12348 4.92979)"
      >
        <stop offset={0.184601} stopColor="#3555A2" />
        <stop offset={1} stopColor="#3555A2" stopOpacity={0} />
      </radialGradient>
      <radialGradient
        id="paint3_radial_18_22342"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(15.5195 17.2411) rotate(135.785) scale(1.52562 8.98525)"
      >
        <stop offset={0.105441} stopColor="#345DBB" />
        <stop offset={1} stopColor="#345DBB" stopOpacity={0} />
      </radialGradient>
      <linearGradient
        id="paint4_linear_18_22342"
        x1={28.7214}
        y1={3.25696}
        x2={28.7214}
        y2={32.8081}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#6F9ED9" />
        <stop offset={0.588443} stopColor="#5386CE" />
        <stop offset={1} stopColor="#5386CE" stopOpacity={0} />
      </linearGradient>
      <radialGradient
        id="paint5_radial_18_22342"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(27.6605 5.05499) rotate(133.668) scale(1.90086 3.10302)"
      >
        <stop stopColor="#FFDA6A" />
        <stop offset={1} stopColor="#EDA92F" />
      </radialGradient>
      <linearGradient
        id="paint6_linear_18_22342"
        x1={26.098}
        y1={5.92999}
        x2={26.5883}
        y2={5.38876}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#EDA836" />
        <stop offset={1} stopColor="#EDA836" stopOpacity={0} />
      </linearGradient>
      <radialGradient
        id="paint7_radial_18_22342"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(17.5793 15.7833) rotate(130.3) scale(3.16139 4.7444)"
      >
        <stop stopColor="#FFD846" />
        <stop offset={1} stopColor="#E9B64B" />
      </radialGradient>
      <linearGradient
        id="paint8_linear_18_22342"
        x1={14.8327}
        y1={16.9126}
        x2={15.3496}
        y2={16.4222}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#EDA836" />
        <stop offset={1} stopColor="#EDA836" stopOpacity={0} />
      </linearGradient>
      <linearGradient
        id="paint9_linear_18_22342"
        x1={12.4522}
        y1={12.6092}
        x2={13.9172}
        y2={13.7994}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#D6A85B" />
        <stop offset={1} stopColor="#D6A85B" stopOpacity={0} />
      </linearGradient>
    </defs>
  </svg>
);
module.exports = PenIcon;