@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
178 lines (177 loc) • 6.99 kB
JSX
const React = require("react");
const CrossMarkIcon = ({ 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_18590_2030)">
<path
d="M4.43459 2.8086C3.82928 2.20329 2.84787 2.20329 2.24256 2.8086C1.63725 3.41391 1.63725 4.39532 2.24256 5.00063L13.4113 16.1694C13.5089 16.267 13.5089 16.4253 13.4113 16.5229L2.24262 27.6916C1.63731 28.2969 1.63731 29.2783 2.24262 29.8836C2.84793 30.4889 3.82934 30.4889 4.43465 29.8836L15.6033 18.715C15.7009 18.6173 15.8592 18.6173 15.9569 18.715L27.1255 29.8836C27.7308 30.4889 28.7122 30.4889 29.3176 29.8836C29.9229 29.2783 29.9229 28.2969 29.3176 27.6916L18.1489 16.5229C18.0513 16.4253 18.0513 16.267 18.1489 16.1694L29.3176 5.00063C29.9229 4.39532 29.9229 3.41391 29.3176 2.8086C28.7123 2.20329 27.7309 2.20329 27.1256 2.8086L15.9569 13.9773C15.8592 14.075 15.7009 14.075 15.6033 13.9773L4.43459 2.8086Z"
fill="url(#paint0_linear_18590_2030)"
/>
<path
d="M4.43459 2.8086C3.82928 2.20329 2.84787 2.20329 2.24256 2.8086C1.63725 3.41391 1.63725 4.39532 2.24256 5.00063L13.4113 16.1694C13.5089 16.267 13.5089 16.4253 13.4113 16.5229L2.24262 27.6916C1.63731 28.2969 1.63731 29.2783 2.24262 29.8836C2.84793 30.4889 3.82934 30.4889 4.43465 29.8836L15.6033 18.715C15.7009 18.6173 15.8592 18.6173 15.9569 18.715L27.1255 29.8836C27.7308 30.4889 28.7122 30.4889 29.3176 29.8836C29.9229 29.2783 29.9229 28.2969 29.3176 27.6916L18.1489 16.5229C18.0513 16.4253 18.0513 16.267 18.1489 16.1694L29.3176 5.00063C29.9229 4.39532 29.9229 3.41391 29.3176 2.8086C28.7123 2.20329 27.7309 2.20329 27.1256 2.8086L15.9569 13.9773C15.8592 14.075 15.7009 14.075 15.6033 13.9773L4.43459 2.8086Z"
fill="url(#paint1_linear_18590_2030)"
/>
</g>
<path
d="M4.43459 2.8086C3.82928 2.20329 2.84787 2.20329 2.24256 2.8086C1.63725 3.41391 1.63725 4.39532 2.24256 5.00063L13.4113 16.1694C13.5089 16.267 13.5089 16.4253 13.4113 16.5229L2.24262 27.6916C1.63731 28.2969 1.63731 29.2783 2.24262 29.8836C2.84793 30.4889 3.82934 30.4889 4.43465 29.8836L15.6033 18.715C15.7009 18.6173 15.8592 18.6173 15.9569 18.715L27.1255 29.8836C27.7308 30.4889 28.7122 30.4889 29.3176 29.8836C29.9229 29.2783 29.9229 28.2969 29.3176 27.6916L18.1489 16.5229C18.0513 16.4253 18.0513 16.267 18.1489 16.1694L29.3176 5.00063C29.9229 4.39532 29.9229 3.41391 29.3176 2.8086C28.7123 2.20329 27.7309 2.20329 27.1256 2.8086L15.9569 13.9773C15.8592 14.075 15.7009 14.075 15.6033 13.9773L4.43459 2.8086Z"
fill="url(#paint2_radial_18590_2030)"
/>
<g filter="url(#filter1_f_18590_2030)">
<path
d="M3.68475 3.55847L15.2005 15.0743M28.5677 28.4415L17.6812 17.5549"
stroke="url(#paint3_linear_18590_2030)"
strokeLinecap="round"
/>
</g>
<g filter="url(#filter2_f_18590_2030)">
<path
d="M27.8319 4.289L17.0519 15.0743M3.68468 28.4415L14.5712 17.555"
stroke="url(#paint4_linear_18590_2030)"
strokeLinecap="round"
/>
</g>
<defs>
<filter
id="filter0_i_18590_2030"
x={1.78857}
y={2.35461}
width={28.483}
height={27.983}
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.5} />
<feGaussianBlur stdDeviation={0.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.776471 0 0 0 0 0.219608 0 0 0 0 0.411765 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18590_2030"
/>
</filter>
<filter
id="filter1_f_18590_2030"
x={2.43475}
y={2.30847}
width={27.383}
height={27.383}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.375}
result="effect1_foregroundBlur_18590_2030"
/>
</filter>
<filter
id="filter2_f_18590_2030"
x={2.43469}
y={3.039}
width={26.6472}
height={26.6525}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.375}
result="effect1_foregroundBlur_18590_2030"
/>
</filter>
<linearGradient
id="paint0_linear_18590_2030"
x1={15.7801}
y1={2.35461}
x2={15.7801}
y2={30.3376}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E02C6B" />
<stop offset={1} stopColor="#FF354E" />
</linearGradient>
<linearGradient
id="paint1_linear_18590_2030"
x1={6.29044}
y1={6.6991}
x2={14.7211}
y2={15.1717}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#EE3D81" />
<stop offset={1} stopColor="#EE3D81" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint2_radial_18590_2030"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(28.755 3.59668) rotate(134.145) scale(1.36671 1.36671)"
>
<stop stopColor="#FF75A7" />
<stop offset={1} stopColor="#FF75A7" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint3_linear_18590_2030"
x1={3.31378}
y1={3.88512}
x2={28.9857}
y2={29.4994}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FF679B" />
<stop offset={1} stopColor="#FF7171" />
</linearGradient>
<linearGradient
id="paint4_linear_18590_2030"
x1={28.9387}
y1={3.88517}
x2={6.319}
y2={26.5049}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#EF4B8B" />
<stop offset={1} stopColor="#FE4753" />
</linearGradient>
</defs>
</svg>
);
module.exports = CrossMarkIcon;