@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
450 lines (449 loc) • 16.9 kB
JSX
const React = require("react");
const CloudWithLightningAndRainIcon = ({ 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_18_15029)">
<path
d="M7.46712 23.4729L5.15713 26.6328C4.58713 27.4128 3.49712 27.5829 2.71712 27.0129C1.93712 26.4429 1.76712 25.3528 2.33712 24.5728L4.64712 21.4128C5.21712 20.6328 6.30712 20.4629 7.08712 21.0329C7.86712 21.6029 8.03712 22.6929 7.46712 23.4729Z"
fill="#535DFF"
/>
<path
d="M7.46712 23.4729L5.15713 26.6328C4.58713 27.4128 3.49712 27.5829 2.71712 27.0129C1.93712 26.4429 1.76712 25.3528 2.33712 24.5728L4.64712 21.4128C5.21712 20.6328 6.30712 20.4629 7.08712 21.0329C7.86712 21.6029 8.03712 22.6929 7.46712 23.4729Z"
fill="url(#paint0_radial_18_15029)"
/>
</g>
<g filter="url(#filter1_i_18_15029)">
<path
d="M12.4671 26.1229L10.1571 29.2829C9.58713 30.0629 8.49712 30.2329 7.71712 29.6629C6.93712 29.0929 6.76712 28.0029 7.33712 27.2229L9.64712 24.0629C10.2171 23.2829 11.3071 23.1129 12.0871 23.6829C12.8671 24.2429 13.0371 25.3429 12.4671 26.1229Z"
fill="#535DFF"
/>
<path
d="M12.4671 26.1229L10.1571 29.2829C9.58713 30.0629 8.49712 30.2329 7.71712 29.6629C6.93712 29.0929 6.76712 28.0029 7.33712 27.2229L9.64712 24.0629C10.2171 23.2829 11.3071 23.1129 12.0871 23.6829C12.8671 24.2429 13.0371 25.3429 12.4671 26.1229Z"
fill="url(#paint1_radial_18_15029)"
/>
</g>
<g filter="url(#filter2_i_18_15029)">
<path
d="M23.567 23.4729L21.257 26.6328C20.687 27.4128 19.597 27.5829 18.817 27.0129C18.037 26.4429 17.867 25.3528 18.437 24.5728L20.747 21.4128C21.317 20.6328 22.407 20.4629 23.187 21.0329C23.967 21.6029 24.137 22.6929 23.567 23.4729Z"
fill="#535DFF"
/>
<path
d="M23.567 23.4729L21.257 26.6328C20.687 27.4128 19.597 27.5829 18.817 27.0129C18.037 26.4429 17.867 25.3528 18.437 24.5728L20.747 21.4128C21.317 20.6328 22.407 20.4629 23.187 21.0329C23.967 21.6029 24.137 22.6929 23.567 23.4729Z"
fill="url(#paint2_radial_18_15029)"
/>
</g>
<g filter="url(#filter3_i_18_15029)">
<path
d="M28.567 26.1229L26.257 29.2829C25.687 30.0629 24.597 30.2329 23.817 29.6629C23.037 29.0929 22.867 28.0029 23.437 27.2229L25.747 24.0629C26.317 23.2829 27.407 23.1129 28.187 23.6829C28.967 24.2429 29.137 25.3429 28.567 26.1229Z"
fill="#535DFF"
/>
<path
d="M28.567 26.1229L26.257 29.2829C25.687 30.0629 24.597 30.2329 23.817 29.6629C23.037 29.0929 22.867 28.0029 23.437 27.2229L25.747 24.0629C26.317 23.2829 27.407 23.1129 28.187 23.6829C28.967 24.2429 29.137 25.3429 28.567 26.1229Z"
fill="url(#paint3_radial_18_15029)"
/>
</g>
<path
d="M12.457 12.0029C14.39 12.0029 15.957 10.4359 15.957 8.50286C15.957 6.56986 14.39 5.00287 12.457 5.00287C10.524 5.00287 8.95703 6.56986 8.95703 8.50286C8.95703 10.4359 10.524 12.0029 12.457 12.0029Z"
fill="url(#paint4_radial_18_15029)"
/>
<g filter="url(#filter4_i_18_15029)">
<path
d="M29.957 10.9944C29.957 15.9697 25.9276 20.0029 20.957 20.0029H8.56079C4.91348 20.0029 1.95703 16.9313 1.95703 13.4968C1.95703 10.0622 4.85437 7.06457 8.50168 7.06457C9.23471 7.06457 10.3239 7.33145 11.2252 7.67911C11.8941 7.93716 12.7947 7.61455 13.1152 6.97318C14.5014 4.1996 17.3848 2.12665 20.9825 2.12665C25.953 2.12665 29.957 6.01918 29.957 10.9944Z"
fill="#3124C5"
/>
<path
d="M29.957 10.9944C29.957 15.9697 25.9276 20.0029 20.957 20.0029H8.56079C4.91348 20.0029 1.95703 16.9313 1.95703 13.4968C1.95703 10.0622 4.85437 7.06457 8.50168 7.06457C9.23471 7.06457 10.3239 7.33145 11.2252 7.67911C11.8941 7.93716 12.7947 7.61455 13.1152 6.97318C14.5014 4.1996 17.3848 2.12665 20.9825 2.12665C25.953 2.12665 29.957 6.01918 29.957 10.9944Z"
fill="url(#paint5_radial_18_15029)"
/>
<path
d="M29.957 10.9944C29.957 15.9697 25.9276 20.0029 20.957 20.0029H8.56079C4.91348 20.0029 1.95703 16.9313 1.95703 13.4968C1.95703 10.0622 4.85437 7.06457 8.50168 7.06457C9.23471 7.06457 10.3239 7.33145 11.2252 7.67911C11.8941 7.93716 12.7947 7.61455 13.1152 6.97318C14.5014 4.1996 17.3848 2.12665 20.9825 2.12665C25.953 2.12665 29.957 6.01918 29.957 10.9944Z"
fill="url(#paint6_radial_18_15029)"
/>
</g>
<path
d="M30 10.9944C30 15.9697 25.9706 20.0029 21 20.0029H8.60376C4.95645 20.0029 2 16.9313 2 13.4968C2 10.0622 4.89734 7.06457 8.54465 7.06457C9.27768 7.06457 10.3669 7.33145 11.2681 7.67911C11.9371 7.93716 12.8377 7.61455 13.1582 6.97318C14.5444 4.1996 17.4278 2.12665 21.0254 2.12665C25.996 2.12665 30 6.01918 30 10.9944Z"
fill="url(#paint7_radial_18_15029)"
/>
<path
d="M30 10.9944C30 15.9697 25.9706 20.0029 21 20.0029H8.60376C4.95645 20.0029 2 16.9313 2 13.4968C2 10.0622 4.89734 7.06457 8.54465 7.06457C9.27768 7.06457 10.3669 7.33145 11.2681 7.67911C11.9371 7.93716 12.8377 7.61455 13.1582 6.97318C14.5444 4.1996 17.4278 2.12665 21.0254 2.12665C25.996 2.12665 30 6.01918 30 10.9944Z"
fill="url(#paint8_radial_18_15029)"
/>
<g filter="url(#filter5_i_18_15029)">
<path
d="M19.5424 19.6248L14.6898 26.9037C14.4703 27.233 13.957 27.0776 13.957 26.6818L13.9569 21.4029C13.9569 21.182 13.7778 21.0029 13.5569 21.0029H12.6787C12.3645 21.0029 12.173 20.6573 12.3395 20.3909L16.2178 14.1856C16.4308 13.8448 16.957 13.9957 16.957 14.3976V18.6029C16.957 18.8238 17.1361 19.0029 17.357 19.0029H19.2096C19.5291 19.0029 19.7196 19.3589 19.5424 19.6248Z"
fill="url(#paint9_linear_18_15029)"
/>
</g>
<g filter="url(#filter6_f_18_15029)">
<path
d="M11.957 9.11285C12.5542 9.80689 13.7583 11.776 13.7971 14.1003"
stroke="url(#paint10_linear_18_15029)"
strokeWidth={0.5}
strokeLinecap="round"
/>
</g>
<defs>
<filter
id="filter0_i_18_15029"
x={2}
y={20.5957}
width={6.40426}
height={6.75424}
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.6} dy={-0.1} />
<feGaussianBlur stdDeviation={0.75} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.256493 0 0 0 0 0.282719 0 0 0 0 0.741667 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_15029"
/>
</filter>
<filter
id="filter1_i_18_15029"
x={7}
y={23.2458}
width={6.40426}
height={6.75424}
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.6} dy={-0.1} />
<feGaussianBlur stdDeviation={0.75} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.256493 0 0 0 0 0.282719 0 0 0 0 0.741667 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_15029"
/>
</filter>
<filter
id="filter2_i_18_15029"
x={18.0999}
y={20.5957}
width={6.40426}
height={6.75424}
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.6} dy={-0.1} />
<feGaussianBlur stdDeviation={0.75} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.256493 0 0 0 0 0.282719 0 0 0 0 0.741667 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_15029"
/>
</filter>
<filter
id="filter3_i_18_15029"
x={23.0999}
y={23.2458}
width={6.40426}
height={6.75424}
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.6} dy={-0.1} />
<feGaussianBlur stdDeviation={0.75} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.256493 0 0 0 0 0.282719 0 0 0 0 0.741667 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_15029"
/>
</filter>
<filter
id="filter4_i_18_15029"
x={1.95703}
y={0.126648}
width={29}
height={19.8763}
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={-2} />
<feGaussianBlur stdDeviation={1} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.207843 0 0 0 0 0.12549 0 0 0 0 0.596078 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_15029"
/>
</filter>
<filter
id="filter5_i_18_15029"
x={12.2781}
y={13.4969}
width={7.83221}
height={13.5856}
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} dy={-0.5} />
<feGaussianBlur stdDeviation={0.25} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.908333 0 0 0 0 0.312137 0 0 0 0 0.0454167 0 0 0 0.5 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_15029"
/>
</filter>
<filter
id="filter6_f_18_15029"
x={10.707}
y={7.86285}
width={4.34003}
height={7.4874}
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_18_15029"
/>
</filter>
<radialGradient
id="paint0_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(7.80424 21.7477) rotate(145.744) scale(2.34511 2.04556)"
>
<stop stopColor="#627AFE" />
<stop offset={1} stopColor="#627AFE" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint1_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(12.8042 24.3977) rotate(145.744) scale(2.34511 2.04556)"
>
<stop stopColor="#627AFE" />
<stop offset={1} stopColor="#627AFE" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint2_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(23.9041 21.7477) rotate(145.744) scale(2.34511 2.04556)"
>
<stop stopColor="#627AFE" />
<stop offset={1} stopColor="#627AFE" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint3_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(28.9041 24.3977) rotate(145.744) scale(2.34511 2.04556)"
>
<stop stopColor="#627AFE" />
<stop offset={1} stopColor="#627AFE" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint4_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(13.4368 5.74919) rotate(140.486) scale(3.98677 3.40611)"
>
<stop stopColor="#4C42D7" />
<stop offset={1} stopColor="#35209B" />
</radialGradient>
<radialGradient
id="paint5_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(14.3176 19.5719) rotate(125.266) scale(8.30268 5.21837)"
>
<stop offset={0.303281} stopColor="#381B90" />
<stop offset={1} stopColor="#381B90" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint6_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(9.81898 11.0648) rotate(133.441) scale(5.78115 5.45881)"
>
<stop stopColor="#574ADF" />
<stop offset={1} stopColor="#574ADF" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint7_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(24.6743 7.12758) rotate(142.503) scale(10.9332 11.9987)"
>
<stop offset={0.141507} stopColor="#6051FF" />
<stop offset={1} stopColor="#6051FF" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint8_radial_18_15029"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(20.843 10.3319) rotate(170.656) scale(19.0964 16.315)"
>
<stop offset={0.799468} stopColor="#35209A" stopOpacity={0} />
<stop offset={1} stopColor="#35209A" />
</radialGradient>
<linearGradient
id="paint9_linear_18_15029"
x1={16.0347}
y1={12.6133}
x2={16.0347}
y2={25.8114}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.3542} stopColor="#FF9B49" />
<stop offset={1} stopColor="#FF4E4B" />
</linearGradient>
<linearGradient
id="paint10_linear_18_15029"
x1={12.2839}
y1={10.3234}
x2={14.1239}
y2={15.8434}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#554BD3" />
<stop offset={1} stopColor="#554BD3" stopOpacity={0} />
</linearGradient>
</defs>
</svg>
);
module.exports = CloudWithLightningAndRainIcon;