@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
277 lines (276 loc) • 8.45 kB
JSX
const React = require("react");
const CheckBoxWithCheckIcon = ({ 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_2006)">
<rect
x={1.87933}
y={1.6875}
width={27.875}
height={27.875}
rx={3.6}
fill="url(#paint0_linear_18590_2006)"
/>
<rect
x={1.87933}
y={1.6875}
width={27.875}
height={27.875}
rx={3.6}
fill="url(#paint1_radial_18590_2006)"
/>
</g>
<g filter="url(#filter1_f_18590_2006)">
<path
d="M28.0668 4.1875V27.0625"
stroke="url(#paint2_linear_18590_2006)"
strokeWidth={1.5}
strokeLinecap="round"
/>
</g>
<g filter="url(#filter2_f_18590_2006)">
<path
d="M5.3432 3.5H27.1245"
stroke="url(#paint3_linear_18590_2006)"
strokeWidth={1.5}
strokeLinecap="round"
/>
</g>
<g filter="url(#filter3_f_18590_2006)">
<path
d="M13.0588 22.625C12.6757 22.625 12.2925 22.4816 11.9998 22.1942L6.25539 16.5528C5.67065 15.9785 5.67065 15.047 6.25539 14.4727C6.84013 13.8985 7.78869 13.8985 8.37343 14.4727L13.0588 19.0741L23.2602 9.05569C23.845 8.48144 24.7935 8.48144 25.3783 9.05569C25.963 9.62994 25.963 10.5615 25.3783 11.1357L14.1178 22.1942C13.8258 22.4816 13.442 22.625 13.0588 22.625Z"
fill="#4A4352"
/>
</g>
<g filter="url(#filter4_ii_18590_2006)">
<path
d="M13.0588 22.625C12.6757 22.625 12.2925 22.4816 11.9998 22.1942L6.25539 16.5528C5.67065 15.9785 5.67065 15.047 6.25539 14.4727C6.84013 13.8985 7.78869 13.8985 8.37343 14.4727L12.9888 19.0053C13.0277 19.0435 13.09 19.0435 13.1289 19.0053L23.2602 9.05569C23.845 8.48144 24.7935 8.48144 25.3783 9.05569C25.963 9.62994 25.963 10.5615 25.3783 11.1357L14.1178 22.1942C13.8258 22.4816 13.442 22.625 13.0588 22.625Z"
fill="#FCF2FF"
/>
</g>
<defs>
<filter
id="filter0_ii_18590_2006"
x={1.87933}
y={0.6875}
width={29.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={2} dy={-1} />
<feGaussianBlur stdDeviation={1.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.156863 0 0 0 0 0.145098 0 0 0 0 0.176471 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18590_2006"
/>
<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.32549 0 0 0 0 0.219608 0 0 0 0 0.419608 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18590_2006"
result="effect2_innerShadow_18590_2006"
/>
</filter>
<filter
id="filter1_f_18590_2006"
x={25.3168}
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_2006"
/>
</filter>
<filter
id="filter2_f_18590_2006"
x={2.5932}
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_2006"
/>
</filter>
<filter
id="filter3_f_18590_2006"
x={4.81683}
y={7.625}
width={22}
height={16}
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_2006"
/>
</filter>
<filter
id="filter4_ii_18590_2006"
x={5.41683}
y={8.225}
width={20.8}
height={14.8}
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.4} dy={0.4} />
<feGaussianBlur stdDeviation={0.375} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.913725 0 0 0 0 0.886275 0 0 0 0 0.968627 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18590_2006"
/>
<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.2} />
<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_2006"
result="effect2_innerShadow_18590_2006"
/>
</filter>
<linearGradient
id="paint0_linear_18590_2006"
x1={15.8168}
y1={5.26201}
x2={15.8168}
y2={28.8497}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#614F74" />
<stop offset={1} stopColor="#484051" />
</linearGradient>
<radialGradient
id="paint1_radial_18590_2006"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(27.5356 3.78125) rotate(136.771) scale(2.14444 2.50466)"
>
<stop offset={0.32856} stopColor="#837296" />
<stop offset={1} stopColor="#837296" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint2_linear_18590_2006"
x1={28.5668}
y1={4.1875}
x2={28.5668}
y2={27.0625}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#746486" />
<stop offset={1} stopColor="#56535B" />
</linearGradient>
<linearGradient
id="paint3_linear_18590_2006"
x1={28.2807}
y1={3.75002}
x2={2.74945}
y2={3.75002}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#705D84" />
<stop offset={1} stopColor="#6A577E" />
</linearGradient>
</defs>
</svg>
);
module.exports = CheckBoxWithCheckIcon;