@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
277 lines (276 loc) • 8.44 kB
JSX
const React = require("react");
const Keycap7Icon = ({ 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_3357)">
<rect
x={1.65088}
y={2.0625}
width={27.875}
height={27.875}
rx={3.6}
fill="url(#paint0_linear_18590_3357)"
/>
<rect
x={1.65088}
y={2.0625}
width={27.875}
height={27.875}
rx={3.6}
fill="url(#paint1_radial_18590_3357)"
/>
</g>
<g filter="url(#filter1_f_18590_3357)">
<path
d="M27.8384 4.5625V27.4375"
stroke="url(#paint2_linear_18590_3357)"
strokeWidth={1.5}
strokeLinecap="round"
/>
</g>
<g filter="url(#filter2_f_18590_3357)">
<path
d="M5.11475 3.875H26.896"
stroke="url(#paint3_linear_18590_3357)"
strokeWidth={1.5}
strokeLinecap="round"
/>
</g>
<g filter="url(#filter3_f_18590_3357)">
<path
d="M10.8787 9.65204C10.8787 8.68554 11.6622 7.90204 12.6287 7.90204H20.1027C20.7265 7.90204 21.3031 8.23408 21.6162 8.77358C21.9294 9.31308 21.9316 9.97847 21.6222 10.5201L14.3696 23.2157C13.8901 24.0549 12.8212 24.3466 11.982 23.8672C11.1428 23.3878 10.8511 22.3188 11.3305 21.4796L17.0021 11.5516C17.0401 11.485 16.992 11.402 16.9152 11.402H12.6287C11.6622 11.402 10.8787 10.6185 10.8787 9.65204Z"
fill="#579FFF"
/>
</g>
<g filter="url(#filter4_ii_18590_3357)">
<path
d="M10.8787 9.65204C10.8787 8.68554 11.6622 7.90204 12.6287 7.90204H20.1027C20.7265 7.90204 21.3031 8.23408 21.6162 8.77358C21.9294 9.31308 21.9316 9.97847 21.6222 10.5201L14.3696 23.2157C13.8901 24.0549 12.8212 24.3466 11.982 23.8672C11.1428 23.3878 10.8511 22.3188 11.3305 21.4796L17.0021 11.5516C17.0401 11.485 16.992 11.402 16.9152 11.402H12.6287C11.6622 11.402 10.8787 10.6185 10.8787 9.65204Z"
fill="#FCF2FF"
/>
</g>
<defs>
<filter
id="filter0_ii_18590_3357"
x={1.65088}
y={1.0625}
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_3357"
/>
<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_3357"
result="effect2_innerShadow_18590_3357"
/>
</filter>
<filter
id="filter1_f_18590_3357"
x={25.0884}
y={1.8125}
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_3357"
/>
</filter>
<filter
id="filter2_f_18590_3357"
x={2.36475}
y={1.125}
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_3357"
/>
</filter>
<filter
id="filter3_f_18590_3357"
x={9.87872}
y={6.90204}
width={12.9739}
height={18.1959}
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_3357"
/>
</filter>
<filter
id="filter4_ii_18590_3357"
x={9.87872}
y={7.50204}
width={12.3739}
height={17.5959}
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_3357"
/>
<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_3357"
result="effect2_innerShadow_18590_3357"
/>
</filter>
<linearGradient
id="paint0_linear_18590_3357"
x1={15.5884}
y1={5.63701}
x2={15.5884}
y2={38.8897}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#5CB7FF" />
<stop offset={1} stopColor="#4878DD" />
</linearGradient>
<radialGradient
id="paint1_radial_18590_3357"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(27.3071 4.15625) rotate(136.771) scale(2.14444 2.50466)"
>
<stop stopColor="#7BD7FF" />
<stop offset={1} stopColor="#7BD7FF" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint2_linear_18590_3357"
x1={28.3384}
y1={4.5625}
x2={28.3384}
y2={27.4375}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#7FD9FF" />
<stop offset={1} stopColor="#639DF4" />
</linearGradient>
<linearGradient
id="paint3_linear_18590_3357"
x1={28.0522}
y1={4.12502}
x2={2.521}
y2={4.12502}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#7DD8FF" />
<stop offset={1} stopColor="#5DB6FF" />
</linearGradient>
</defs>
</svg>
);
module.exports = Keycap7Icon;