@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
285 lines (284 loc) • 9.39 kB
JSX
const React = require("react");
const Keycap10Icon = ({ 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_3401)">
<rect
x={1.65088}
y={1.6875}
width={27.875}
height={27.875}
rx={3.6}
fill="url(#paint0_linear_18590_3401)"
/>
<rect
x={1.65088}
y={1.6875}
width={27.875}
height={27.875}
rx={3.6}
fill="url(#paint1_radial_18590_3401)"
/>
</g>
<g filter="url(#filter1_f_18590_3401)">
<path
d="M27.8384 4.1875V27.0625"
stroke="url(#paint2_linear_18590_3401)"
strokeWidth={1.5}
strokeLinecap="round"
/>
</g>
<g filter="url(#filter2_f_18590_3401)">
<path
d="M5.11475 3.5H26.896"
stroke="url(#paint3_linear_18590_3401)"
strokeWidth={1.5}
strokeLinecap="round"
/>
</g>
<g filter="url(#filter3_f_18590_3401)">
<path
d="M19.9255 7.375C16.6118 7.375 13.9255 10.0613 13.9255 13.375V17.875C13.9255 21.1887 16.6118 23.875 19.9255 23.875C23.2392 23.875 25.9255 21.1887 25.9255 17.875V13.375C25.9255 10.0613 23.2392 7.375 19.9255 7.375ZM17.4255 13.375C17.4255 11.9943 18.5448 10.875 19.9255 10.875C21.3062 10.875 22.4255 11.9943 22.4255 13.375V17.875C22.4255 19.2557 21.3062 20.375 19.9255 20.375C18.5448 20.375 17.4255 19.2557 17.4255 17.875V13.375Z"
fill="#579FFF"
/>
<path
d="M11.9255 9.12506C11.9255 8.40946 11.4898 7.76596 10.8254 7.50021C10.1609 7.23446 9.40166 7.40001 8.90817 7.91824L5.73391 11.2516C5.0674 11.9515 5.09448 13.0592 5.7944 13.7257C6.49432 14.3922 7.60202 14.3652 8.26853 13.6652V13.6652C8.3252 13.6057 8.42548 13.6458 8.42548 13.728V22.1251C8.42548 23.0916 9.20898 23.8751 10.1755 23.8751C11.142 23.8751 11.9255 23.0916 11.9255 22.1251V9.12506Z"
fill="#579FFF"
/>
</g>
<g filter="url(#filter4_ii_18590_3401)">
<path
d="M19.9255 7.375C16.6118 7.375 13.9255 10.0613 13.9255 13.375V17.875C13.9255 21.1887 16.6118 23.875 19.9255 23.875C23.2392 23.875 25.9255 21.1887 25.9255 17.875V13.375C25.9255 10.0613 23.2392 7.375 19.9255 7.375ZM17.4255 13.375C17.4255 11.9943 18.5448 10.875 19.9255 10.875C21.3062 10.875 22.4255 11.9943 22.4255 13.375V17.875C22.4255 19.2557 21.3062 20.375 19.9255 20.375C18.5448 20.375 17.4255 19.2557 17.4255 17.875V13.375Z"
fill="#FCF2FF"
/>
<path
d="M11.9255 9.12506C11.9255 8.40946 11.4898 7.76596 10.8254 7.50021C10.1609 7.23446 9.40166 7.40001 8.90817 7.91824L5.73391 11.2516C5.0674 11.9515 5.09448 13.0592 5.7944 13.7257C6.49432 14.3922 7.60202 14.3652 8.26853 13.6652V13.6652C8.3252 13.6057 8.42548 13.6458 8.42548 13.728V22.1251C8.42548 23.0916 9.20898 23.8751 10.1755 23.8751C11.142 23.8751 11.9255 23.0916 11.9255 22.1251V9.12506Z"
fill="#FCF2FF"
/>
</g>
<defs>
<filter
id="filter0_ii_18590_3401"
x={1.65088}
y={0.6875}
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_3401"
/>
<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_3401"
result="effect2_innerShadow_18590_3401"
/>
</filter>
<filter
id="filter1_f_18590_3401"
x={25.0884}
y={1.4375}
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_3401"
/>
</filter>
<filter
id="filter2_f_18590_3401"
x={2.36475}
y={0.75}
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_3401"
/>
</filter>
<filter
id="filter3_f_18590_3401"
x={4.25122}
y={6.375}
width={22.6743}
height={18.5001}
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_3401"
/>
</filter>
<filter
id="filter4_ii_18590_3401"
x={4.25122}
y={6.975}
width={22.0743}
height={17.9001}
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_3401"
/>
<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_3401"
result="effect2_innerShadow_18590_3401"
/>
</filter>
<linearGradient
id="paint0_linear_18590_3401"
x1={15.5884}
y1={5.26201}
x2={15.5884}
y2={38.5147}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#5CB7FF" />
<stop offset={1} stopColor="#4878DD" />
</linearGradient>
<radialGradient
id="paint1_radial_18590_3401"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(27.3071 3.78125) rotate(136.771) scale(2.14444 2.50466)"
>
<stop stopColor="#7BD7FF" />
<stop offset={1} stopColor="#7BD7FF" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint2_linear_18590_3401"
x1={28.3384}
y1={4.1875}
x2={28.3384}
y2={27.0625}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#7FD9FF" />
<stop offset={1} stopColor="#639DF4" />
</linearGradient>
<linearGradient
id="paint3_linear_18590_3401"
x1={28.0522}
y1={3.75002}
x2={2.521}
y2={3.75002}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#7DD8FF" />
<stop offset={1} stopColor="#5DB6FF" />
</linearGradient>
</defs>
</svg>
);
module.exports = Keycap10Icon;