const React = require("react");
const Keycap8Icon = ({ 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_18590_3372)">
      <rect
        x={1.65088}
        y={1.9375}
        width={27.875}
        height={27.875}
        rx={3.6}
        fill="url(#paint0_linear_18590_3372)"
      />
      <rect
        x={1.65088}
        y={1.9375}
        width={27.875}
        height={27.875}
        rx={3.6}
        fill="url(#paint1_radial_18590_3372)"
      />
    </g>
    <g filter="url(#filter1_f_18590_3372)">
      <path
        d="M27.8384 4.4375V27.3125"
        stroke="url(#paint2_linear_18590_3372)"
        strokeWidth={1.5}
        strokeLinecap="round"
      />
    </g>
    <g filter="url(#filter2_f_18590_3372)">
      <path
        d="M5.11475 3.75H26.896"
        stroke="url(#paint3_linear_18590_3372)"
        strokeWidth={1.5}
        strokeLinecap="round"
      />
    </g>
    <g filter="url(#filter3_f_18590_3372)">
      <path
        d="M15.5603 8.07043C13.066 8.07043 11.0439 10.0925 11.0439 12.5868C11.0439 13.617 11.3888 14.5666 11.9694 15.3264C12.0012 15.368 11.9968 15.427 11.9591 15.4632C10.9681 16.4161 10.3514 17.7553 10.3514 19.2386C10.3514 22.1309 12.6961 24.4756 15.5884 24.4756C18.4807 24.4756 20.8253 22.1309 20.8253 19.2386C20.8253 17.7395 20.1954 16.3874 19.1857 15.4328C19.1477 15.3968 19.1428 15.3379 19.1742 15.2961C19.7409 14.5413 20.0767 13.6033 20.0767 12.5868C20.0767 10.0925 18.0547 8.07043 15.5603 8.07043ZM14.2939 12.5868C14.2939 11.8874 14.8609 11.3204 15.5603 11.3204C16.2598 11.3204 16.8267 11.8874 16.8267 12.5868C16.8267 13.2862 16.2598 13.8532 15.5603 13.8532C14.8609 13.8532 14.2939 13.2862 14.2939 12.5868ZM13.8514 19.2386C13.8514 18.2794 14.6291 17.5017 15.5884 17.5017C16.5477 17.5017 17.3253 18.2794 17.3253 19.2386C17.3253 20.1979 16.5477 20.9756 15.5884 20.9756C14.6291 20.9756 13.8514 20.1979 13.8514 19.2386Z"
        fill="#579FFF"
      />
    </g>
    <g filter="url(#filter4_ii_18590_3372)">
      <path
        d="M15.5603 8.07043C13.066 8.07043 11.0439 10.0925 11.0439 12.5868C11.0439 13.617 11.3888 14.5666 11.9694 15.3264C12.0012 15.368 11.9968 15.427 11.9591 15.4632C10.9681 16.4161 10.3514 17.7553 10.3514 19.2386C10.3514 22.1309 12.6961 24.4756 15.5884 24.4756C18.4807 24.4756 20.8253 22.1309 20.8253 19.2386C20.8253 17.7395 20.1954 16.3874 19.1857 15.4328C19.1477 15.3968 19.1428 15.3379 19.1742 15.2961C19.7409 14.5413 20.0767 13.6033 20.0767 12.5868C20.0767 10.0925 18.0547 8.07043 15.5603 8.07043ZM14.2939 12.5868C14.2939 11.8874 14.8609 11.3204 15.5603 11.3204C16.2598 11.3204 16.8267 11.8874 16.8267 12.5868C16.8267 13.2862 16.2598 13.8532 15.5603 13.8532C14.8609 13.8532 14.2939 13.2862 14.2939 12.5868ZM13.8514 19.2386C13.8514 18.2794 14.6291 17.5017 15.5884 17.5017C16.5477 17.5017 17.3253 18.2794 17.3253 19.2386C17.3253 20.1979 16.5477 20.9756 15.5884 20.9756C14.6291 20.9756 13.8514 20.1979 13.8514 19.2386Z"
        fill="#FCF2FF"
      />
    </g>
    <defs>
      <filter
        id="filter0_ii_18590_3372"
        x={1.65088}
        y={0.9375}
        width={28.875}
        height={28.875}
        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.5} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.188235 0 0 0 0 0.470588 0 0 0 0 0.843137 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18590_3372"
        />
        <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={-1} />
        <feGaussianBlur stdDeviation={1.5} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 0.27451 0 0 0 0 0.34902 0 0 0 0 0.8 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="effect1_innerShadow_18590_3372"
          result="effect2_innerShadow_18590_3372"
        />
      </filter>
      <filter
        id="filter1_f_18590_3372"
        x={25.0884}
        y={1.6875}
        width={5.5}
        height={28.375}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={1}
          result="effect1_foregroundBlur_18590_3372"
        />
      </filter>
      <filter
        id="filter2_f_18590_3372"
        x={2.36475}
        y={1}
        width={27.2812}
        height={5.5}
        filterUnits="userSpaceOnUse"
        colorInterpolationFilters="sRGB"
      >
        <feFlood floodOpacity={0} result="BackgroundImageFix" />
        <feBlend
          mode="normal"
          in="SourceGraphic"
          in2="BackgroundImageFix"
          result="shape"
        />
        <feGaussianBlur
          stdDeviation={1}
          result="effect1_foregroundBlur_18590_3372"
        />
      </filter>
      <filter
        id="filter3_f_18590_3372"
        x={9.35144}
        y={7.07043}
        width={12.4739}
        height={18.4052}
        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_18590_3372"
        />
      </filter>
      <filter
        id="filter4_ii_18590_3372"
        x={9.35144}
        y={7.67043}
        width={11.8739}
        height={17.8052}
        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.866667 0 0 0 0 0.819608 0 0 0 0 0.941176 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="shape"
          result="effect1_innerShadow_18590_3372"
        />
        <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.4} dy={-0.4} />
        <feGaussianBlur stdDeviation={0.5} />
        <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
        <feColorMatrix
          type="matrix"
          values="0 0 0 0 1 0 0 0 0 0.988235 0 0 0 0 1 0 0 0 1 0"
        />
        <feBlend
          mode="normal"
          in2="effect1_innerShadow_18590_3372"
          result="effect2_innerShadow_18590_3372"
        />
      </filter>
      <linearGradient
        id="paint0_linear_18590_3372"
        x1={15.5884}
        y1={5.51201}
        x2={15.5884}
        y2={38.7647}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#5CB7FF" />
        <stop offset={1} stopColor="#4878DD" />
      </linearGradient>
      <radialGradient
        id="paint1_radial_18590_3372"
        cx={0}
        cy={0}
        r={1}
        gradientUnits="userSpaceOnUse"
        gradientTransform="translate(27.3071 4.03125) rotate(136.771) scale(2.14444 2.50466)"
      >
        <stop stopColor="#7BD7FF" />
        <stop offset={1} stopColor="#7BD7FF" stopOpacity={0} />
      </radialGradient>
      <linearGradient
        id="paint2_linear_18590_3372"
        x1={28.3384}
        y1={4.4375}
        x2={28.3384}
        y2={27.3125}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#7FD9FF" />
        <stop offset={1} stopColor="#639DF4" />
      </linearGradient>
      <linearGradient
        id="paint3_linear_18590_3372"
        x1={28.0522}
        y1={4.00002}
        x2={2.521}
        y2={4.00002}
        gradientUnits="userSpaceOnUse"
      >
        <stop stopColor="#7DD8FF" />
        <stop offset={1} stopColor="#5DB6FF" />
      </linearGradient>
    </defs>
  </svg>
);
module.exports = Keycap8Icon;