@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
255 lines (254 loc) • 8.83 kB
JSX
const React = require("react");
const ColdFaceIcon = ({ 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_31_131)">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M29.9978 15.9989C29.9978 19.8639 28.8321 23.363 26.5 25.8962V28.5L26 30H24.5L23.2741 28.3655C21.2888 29.4074 18.8638 29.9978 15.9989 29.9978C14.915 29.9978 13.8941 29.9133 12.9362 29.7518L12 31L10.5 31.5L10 31L9 30V28.5061C8.61906 28.3181 8.25368 28.1138 7.90385 27.8942L7.5 28.5L6 29L5 27.5V25.3192C2.99982 22.844 2 19.5783 2 15.9989C2 8.26751 6.66443 2 15.9989 2C25.3333 2 29.9978 8.26751 29.9978 15.9989Z"
fill="url(#paint0_radial_31_131)"
/>
</g>
<circle cx={9} cy={15} r={5} fill="url(#paint1_radial_31_131)" />
<circle cx={19.5} cy={15.5} r={4.5} fill="url(#paint2_radial_31_131)" />
<path
d="M10.5 18C12.9853 18 15 15.9853 15 13.5C15 11.0147 12.9853 9 10.5 9C8.01472 9 6 11.0147 6 13.5C6 15.9853 8.01472 18 10.5 18Z"
fill="white"
/>
<path
d="M21.5 18C23.9853 18 26 15.9853 26 13.5C26 11.0147 23.9853 9 21.5 9C19.0147 9 17 11.0147 17 13.5C17 15.9853 19.0147 18 21.5 18Z"
fill="white"
/>
<path
d="M12 16C13.1046 16 14 15.1046 14 14C14 12.8954 13.1046 12 12 12C10.8954 12 10 12.8954 10 14C10 15.1046 10.8954 16 12 16Z"
fill="url(#paint3_linear_31_131)"
/>
<path
d="M20 16C21.1046 16 22 15.1046 22 14C22 12.8954 21.1046 12 20 12C18.8954 12 18 12.8954 18 14C18 15.1046 18.8954 16 20 16Z"
fill="url(#paint4_linear_31_131)"
/>
<path
d="M29.8728 15.9989C29.8728 19.8401 28.7142 23.3073 26.4068 25.8129C24.101 28.3168 20.6366 29.8728 15.9989 29.8728C11.3612 29.8728 7.89681 28.3168 5.59097 25.8129C3.28359 23.3073 2.125 19.8401 2.125 15.9989C2.125 12.1576 3.28359 8.69043 5.59097 6.18485C7.89681 3.68096 11.3612 2.125 15.9989 2.125C20.6366 2.125 24.101 3.68096 26.4068 6.18485C28.7142 8.69043 29.8728 12.1576 29.8728 15.9989Z"
fill="url(#paint5_linear_31_131)"
stroke="url(#paint6_radial_31_131)"
strokeWidth={0.25}
/>
<rect x={9} y={19} width={14} height={6} rx={3} fill="#3A3E67" />
<path
fillRule="evenodd"
clipRule="evenodd"
d="M20 19H12C10.9335 19 9.99695 19.5565 9.46497 20.395L9.65808 20.9743C9.86225 21.5869 10.4355 22 11.0811 22H20.9188C21.5645 22 22.1377 21.5869 22.3419 20.9743L22.535 20.395C22.003 19.5565 21.0665 19 20 19Z"
fill="url(#paint7_linear_31_131)"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M12 25H20C20.2632 25 20.5184 24.9661 20.7616 24.9025C21.2482 24.7175 21.6188 24.2857 21.7086 23.7465L21.9026 22.5822C21.9534 22.2774 21.7183 22 21.4094 22H10.5898C10.2809 22 10.0458 22.2775 10.0967 22.5822L10.2908 23.7467C10.3806 24.2853 10.7506 24.7168 11.2365 24.902C11.4803 24.9659 11.7362 25 12 25Z"
fill="url(#paint8_linear_31_131)"
/>
<path
d="M10.5 5.5C10.5 5.5 10 8.5 6.5 8.5"
stroke="url(#paint9_linear_31_131)"
strokeWidth={1.25}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M10.5 5.5C10.5 5.5 10 8.5 6.5 8.5"
stroke="url(#paint10_radial_31_131)"
strokeWidth={1.25}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M21.5 5.5C21.5 5.5 22 8.5 25.5 8.5"
stroke="url(#paint11_radial_31_131)"
strokeWidth={1.25}
strokeLinecap="round"
strokeLinejoin="round"
/>
<defs>
<filter
id="filter0_i_31_131"
x={2}
y={2}
width={28.9978}
height={31.5}
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.25} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.16 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_31_131"
/>
</filter>
<radialGradient
id="paint0_radial_31_131"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(26.5 10.5) rotate(136.548) scale(26.1725 40.9348)"
>
<stop stopColor="#BCDFFF" />
<stop offset={0.457009} stopColor="#BDB5FF" />
<stop offset={1} stopColor="#AE89FF" />
</radialGradient>
<radialGradient
id="paint1_radial_31_131"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(11.5 12) rotate(132.51) scale(8.13941 4.21269)"
>
<stop offset={0.309386} stopColor="#765FD7" />
<stop offset={1} stopColor="#765FD7" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint2_radial_31_131"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(21.75 12.8) rotate(132.51) scale(7.32547 3.79142)"
>
<stop offset={0.0533088} stopColor="#765FD7" />
<stop offset={1} stopColor="#765FD7" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint3_linear_31_131"
x1={20.6154}
y1={12}
x2={19.9265}
y2={16.0302}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#553B3E" />
<stop offset={1} stopColor="#3D2432" />
</linearGradient>
<linearGradient
id="paint4_linear_31_131"
x1={20.6154}
y1={12}
x2={19.9265}
y2={16.0302}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#553B3E" />
<stop offset={1} stopColor="#3D2432" />
</linearGradient>
<linearGradient
id="paint5_linear_31_131"
x1={15.9989}
y1={2}
x2={15.9989}
y2={11}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#5DA0FF" />
<stop offset={1} stopColor="#5DA0FF" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint6_radial_31_131"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(15.9989 28.5) rotate(-90) scale(15.5)"
>
<stop stopColor="#F4BCFF" />
<stop offset={1} stopColor="#F4BCFF" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint7_linear_31_131"
x1={17.8671}
y1={21}
x2={17.8671}
y2={22}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FFF2FF" />
<stop offset={0.717436} stopColor="#FFECFF" />
<stop offset={0.988281} stopColor="#383B64" />
</linearGradient>
<linearGradient
id="paint8_linear_31_131"
x1={17.9714}
y1={22}
x2={17.9714}
y2={27}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FFF7FF" />
<stop offset={1} stopColor="#FFE1FF" />
</linearGradient>
<linearGradient
id="paint9_linear_31_131"
x1={9.5}
y1={5}
x2={9.5}
y2={6.5}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.0299084} stopColor="#524049" />
<stop offset={1} stopColor="#4A2C42" />
</linearGradient>
<radialGradient
id="paint10_radial_31_131"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(7 5) rotate(54.4623) scale(4.30116)"
>
<stop offset={0.541667} stopColor="#493032" />
<stop offset={0.806723} stopColor="#5E445A" />
<stop offset={0.955326} stopColor="#4A2C42" />
</radialGradient>
<radialGradient
id="paint11_radial_31_131"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(25 5) rotate(125.538) scale(4.30116)"
>
<stop stopColor="#C2B4B5" />
<stop offset={0.887405} stopColor="#462B45" />
<stop offset={1} stopColor="#4A2C42" />
</radialGradient>
</defs>
</svg>
);
module.exports = ColdFaceIcon;