@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
553 lines (552 loc) • 21.1 kB
JSX
const React = require("react");
const DivingMaskIcon = ({ 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_2953)">
<path
d="M12.0355 20.503L12.0355 21.9891C12.0355 26.3981 15.6096 29.9722 20.0185 29.9722C24.4274 29.9722 28.0016 26.3981 28.0016 21.9891V2.62777C28.0016 2.2964 27.733 2.02777 27.4016 2.02777H25.6016C25.2702 2.02777 25.0016 2.2964 25.0016 2.62777V21.9891C25.0016 24.7412 22.7706 26.9722 20.0185 26.9722C17.2665 26.9722 15.0355 24.7412 15.0355 21.9891L15.0355 20.503H12.0355Z"
fill="url(#paint0_linear_18_2953)"
/>
<path
d="M12.0355 20.503L12.0355 21.9891C12.0355 26.3981 15.6096 29.9722 20.0185 29.9722C24.4274 29.9722 28.0016 26.3981 28.0016 21.9891V2.62777C28.0016 2.2964 27.733 2.02777 27.4016 2.02777H25.6016C25.2702 2.02777 25.0016 2.2964 25.0016 2.62777V21.9891C25.0016 24.7412 22.7706 26.9722 20.0185 26.9722C17.2665 26.9722 15.0355 24.7412 15.0355 21.9891L15.0355 20.503H12.0355Z"
fill="url(#paint1_radial_18_2953)"
/>
<path
d="M12.0355 20.503L12.0355 21.9891C12.0355 26.3981 15.6096 29.9722 20.0185 29.9722C24.4274 29.9722 28.0016 26.3981 28.0016 21.9891V2.62777C28.0016 2.2964 27.733 2.02777 27.4016 2.02777H25.6016C25.2702 2.02777 25.0016 2.2964 25.0016 2.62777V21.9891C25.0016 24.7412 22.7706 26.9722 20.0185 26.9722C17.2665 26.9722 15.0355 24.7412 15.0355 21.9891L15.0355 20.503H12.0355Z"
fill="url(#paint2_radial_18_2953)"
/>
<path
d="M12.0355 20.503L12.0355 21.9891C12.0355 26.3981 15.6096 29.9722 20.0185 29.9722C24.4274 29.9722 28.0016 26.3981 28.0016 21.9891V2.62777C28.0016 2.2964 27.733 2.02777 27.4016 2.02777H25.6016C25.2702 2.02777 25.0016 2.2964 25.0016 2.62777V21.9891C25.0016 24.7412 22.7706 26.9722 20.0185 26.9722C17.2665 26.9722 15.0355 24.7412 15.0355 21.9891L15.0355 20.503H12.0355Z"
fill="url(#paint3_radial_18_2953)"
/>
</g>
<g filter="url(#filter1_i_18_2953)">
<path
d="M15.9845 20.0278H11.0187C10.4603 20.0278 10.0016 20.4788 10.0016 21.0278C10.0016 21.5768 10.4603 22.0278 11.0187 22.0278H15.9845C16.5429 22.0278 17.0016 21.5768 17.0016 21.0278C17.0016 20.4788 16.5529 20.0278 15.9845 20.0278Z"
fill="#592782"
/>
</g>
<path
d="M15.9845 20.0278H11.0187C10.4603 20.0278 10.0016 20.4788 10.0016 21.0278C10.0016 21.5768 10.4603 22.0278 11.0187 22.0278H15.9845C16.5429 22.0278 17.0016 21.5768 17.0016 21.0278C17.0016 20.4788 16.5529 20.0278 15.9845 20.0278Z"
fill="url(#paint4_radial_18_2953)"
/>
<g filter="url(#filter2_i_18_2953)">
<path
d="M11.0327 15.7654C11.1525 17.0341 12.2217 18.0278 13.5216 18.0278C14.8139 18.0278 15.8782 17.0456 16 15.7875L15.8832 15.554C15.4371 15.1757 15.1224 14.7214 14.8872 14.1597L14.4177 13.1425C14.2682 12.8037 13.8805 12.5449 13.5216 12.5449C13.1526 12.5449 12.7078 12.8037 12.5682 13.1425L12.1271 14.1597C11.8998 14.7028 11.5785 15.1318 11.1526 15.5042L11.0327 15.7654Z"
fill="#563676"
/>
<path
d="M11.0327 15.7654C11.1525 17.0341 12.2217 18.0278 13.5216 18.0278C14.8139 18.0278 15.8782 17.0456 16 15.7875L15.8832 15.554C15.4371 15.1757 15.1224 14.7214 14.8872 14.1597L14.4177 13.1425C14.2682 12.8037 13.8805 12.5449 13.5216 12.5449C13.1526 12.5449 12.7078 12.8037 12.5682 13.1425L12.1271 14.1597C11.8998 14.7028 11.5785 15.1318 11.1526 15.5042L11.0327 15.7654Z"
fill="url(#paint5_radial_18_2953)"
/>
</g>
<path
d="M11.7418 12.8325L11.3247 13.8151L11.3228 13.8196C10.8901 14.8531 9.87756 15.5278 8.75515 15.5278C6.12594 15.5278 4.00159 13.4038 4.00159 10.7778C4.00159 8.15395 6.12369 6.02777 8.7751 6.02777H18.248C20.8772 6.02777 23.0016 8.15169 23.0016 10.7778C23.0016 13.4039 20.8772 15.5278 18.248 15.5278C17.1256 15.5278 16.1131 14.8531 15.6804 13.8196L15.2569 12.822L15.254 12.8154C14.9511 12.1293 14.2728 11.6612 13.5016 11.6612C12.7332 11.6612 12.0385 12.1191 11.7418 12.8325Z"
fill="url(#paint6_radial_18_2953)"
/>
<path
d="M11.7418 12.8325L11.3247 13.8151L11.3228 13.8196C10.8901 14.8531 9.87756 15.5278 8.75515 15.5278C6.12594 15.5278 4.00159 13.4038 4.00159 10.7778C4.00159 8.15395 6.12369 6.02777 8.7751 6.02777H18.248C20.8772 6.02777 23.0016 8.15169 23.0016 10.7778C23.0016 13.4039 20.8772 15.5278 18.248 15.5278C17.1256 15.5278 16.1131 14.8531 15.6804 13.8196L15.2569 12.822L15.254 12.8154C14.9511 12.1293 14.2728 11.6612 13.5016 11.6612C12.7332 11.6612 12.0385 12.1191 11.7418 12.8325Z"
fill="url(#paint7_radial_18_2953)"
/>
<path
d="M11.7418 12.8325L11.3247 13.8151L11.3228 13.8196C10.8901 14.8531 9.87756 15.5278 8.75515 15.5278C6.12594 15.5278 4.00159 13.4038 4.00159 10.7778C4.00159 8.15395 6.12369 6.02777 8.7751 6.02777H18.248C20.8772 6.02777 23.0016 8.15169 23.0016 10.7778C23.0016 13.4039 20.8772 15.5278 18.248 15.5278C17.1256 15.5278 16.1131 14.8531 15.6804 13.8196L15.2569 12.822L15.254 12.8154C14.9511 12.1293 14.2728 11.6612 13.5016 11.6612C12.7332 11.6612 12.0385 12.1191 11.7418 12.8325Z"
fill="url(#paint8_radial_18_2953)"
/>
<path
d="M11.7418 12.8325L11.3247 13.8151L11.3228 13.8196C10.8901 14.8531 9.87756 15.5278 8.75515 15.5278C6.12594 15.5278 4.00159 13.4038 4.00159 10.7778C4.00159 8.15395 6.12369 6.02777 8.7751 6.02777H18.248C20.8772 6.02777 23.0016 8.15169 23.0016 10.7778C23.0016 13.4039 20.8772 15.5278 18.248 15.5278C17.1256 15.5278 16.1131 14.8531 15.6804 13.8196L15.2569 12.822L15.254 12.8154C14.9511 12.1293 14.2728 11.6612 13.5016 11.6612C12.7332 11.6612 12.0385 12.1191 11.7418 12.8325Z"
fill="url(#paint9_radial_18_2953)"
/>
<g filter="url(#filter3_i_18_2953)">
<path
d="M18.2281 6.64215C20.5116 6.64215 22.3663 8.4957 22.3663 10.7778C22.3663 13.0598 20.5116 14.9134 18.2281 14.9134C17.3506 14.9134 16.5728 14.3952 16.2338 13.588L15.815 12.6014C15.4161 11.6647 14.5087 11.0568 13.4916 11.0568C12.4745 11.0568 11.5571 11.6647 11.1683 12.6014L10.7495 13.588C10.4104 14.3952 9.63265 14.9134 8.75515 14.9134C6.47168 14.9134 4.61697 13.0598 4.61697 10.7778C4.61697 8.4957 6.47168 6.64215 8.75515 6.64215H18.2281ZM18.2281 5.02777H8.75515C5.57424 5.02777 3.00159 7.59882 3.00159 10.7778C3.00159 13.9567 5.57424 16.5278 8.75515 16.5278C10.2808 16.5278 11.6569 15.611 12.2452 14.2059L12.664 13.2193C12.8036 12.8805 13.1326 12.6612 13.5016 12.6612C13.8606 12.6612 14.1896 12.8805 14.3392 13.2193L14.758 14.2059C15.3463 15.611 16.7224 16.5278 18.248 16.5278C21.4289 16.5278 24.0016 13.9567 24.0016 10.7778C23.9916 7.59882 21.409 5.02777 18.2281 5.02777Z"
fill="url(#paint10_linear_18_2953)"
/>
</g>
<g filter="url(#filter4_f_18_2953)">
<path
d="M19.4165 5.68341C20.7427 5.94217 23.395 7.3233 23.395 10.7778"
stroke="url(#paint11_linear_18_2953)"
strokeWidth={0.35}
/>
</g>
<g filter="url(#filter5_f_18_2953)">
<path
d="M4.44873 12.1111C4.62663 12.8469 5.50642 14.4982 7.60239 15.2162"
stroke="url(#paint12_linear_18_2953)"
strokeWidth={0.35}
/>
</g>
<g filter="url(#filter6_f_18_2953)">
<path
d="M13.9218 11.359C14.3019 11.3914 15.1445 11.6841 15.4744 12.5962C15.8868 13.7364 16.4205 15.0464 17.7305 15.2162"
stroke="url(#paint13_linear_18_2953)"
strokeWidth={0.2}
/>
</g>
<g filter="url(#filter7_f_18_2953)">
<path
d="M26.9543 5.76972V21.7618"
stroke="url(#paint14_linear_18_2953)"
strokeWidth={0.5}
/>
</g>
<path
d="M28.0016 6.16351H25.0016V2.62778C25.0016 2.29639 25.2702 2.02777 25.6016 2.02777H27.4016C27.7329 2.02777 28.0016 2.29639 28.0016 2.62778V6.16351Z"
fill="url(#paint15_linear_18_2953)"
/>
<path
d="M28.0016 6.16351H25.0016V2.62778C25.0016 2.29639 25.2702 2.02777 25.6016 2.02777H27.4016C27.7329 2.02777 28.0016 2.29639 28.0016 2.62778V6.16351Z"
fill="url(#paint16_radial_18_2953)"
/>
<g filter="url(#filter8_f_18_2953)">
<path
d="M13.9789 22.6342C14.2091 24.3788 15.7961 27.868 20.303 27.868"
stroke="#FF657A"
strokeWidth={0.5}
/>
</g>
<defs>
<filter
id="filter0_i_18_2953"
x={12.0355}
y={2.02777}
width={16.3161}
height={27.9445}
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.35} />
<feGaussianBlur stdDeviation={0.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.741176 0 0 0 0 0.286275 0 0 0 0 0.431373 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_2953"
/>
</filter>
<filter
id="filter1_i_18_2953"
x={10.0016}
y={20.0278}
width={7.5}
height={2.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={0.5} dy={0.5} />
<feGaussianBlur stdDeviation={0.375} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.247059 0 0 0 0 0.172549 0 0 0 0 0.286275 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_2953"
/>
</filter>
<filter
id="filter2_i_18_2953"
x={11.0327}
y={12.1449}
width={5.76729}
height={5.88285}
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.8} dy={-0.4} />
<feGaussianBlur stdDeviation={0.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.239216 0 0 0 0 0.129412 0 0 0 0 0.333333 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_2953"
/>
</filter>
<filter
id="filter3_i_18_2953"
x={3.00159}
y={5.02777}
width={21.25}
height={11.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={0.25} />
<feGaussianBlur stdDeviation={0.25} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.709804 0 0 0 0 0.211765 0 0 0 0 0.321569 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_2953"
/>
</filter>
<filter
id="filter4_f_18_2953"
x={19.033}
y={5.16166}
width={4.88695}
height={5.96611}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.175}
result="effect1_foregroundBlur_18_2953"
/>
</filter>
<filter
id="filter5_f_18_2953"
x={3.92863}
y={11.7199}
width={4.08049}
height={4.01183}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.175}
result="effect1_foregroundBlur_18_2953"
/>
</filter>
<filter
id="filter6_f_18_2953"
x={13.5633}
y={10.9094}
width={4.53002}
height={4.75597}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.175}
result="effect1_foregroundBlur_18_2953"
/>
</filter>
<filter
id="filter7_f_18_2953"
x={26.2043}
y={5.26971}
width={1.5}
height={16.9921}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.25}
result="effect1_foregroundBlur_18_2953"
/>
</filter>
<filter
id="filter8_f_18_2953"
x={13.081}
y={21.9514}
width={7.87196}
height={6.81648}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.325}
result="effect1_foregroundBlur_18_2953"
/>
</filter>
<linearGradient
id="paint0_linear_18_2953"
x1={20.0185}
y1={2.02777}
x2={20.0185}
y2={29.9722}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FF379E" />
<stop offset={1} stopColor="#FF2A77" />
</linearGradient>
<radialGradient
id="paint1_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(20.0185 23.9092) rotate(90) scale(5.30213 9.11472)"
>
<stop offset={0.339394} stopColor="#FF4A67" />
<stop offset={1} stopColor="#FF4A67" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint2_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(12.0355 21.5634) rotate(90) scale(5.30213 1.34327)"
>
<stop stopColor="#BC3050" />
<stop offset={1} stopColor="#BC3050" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint3_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(15.9301 21.8526) rotate(180) scale(3.89459 1.5103)"
>
<stop offset={0.17327} stopColor="#B8374D" />
<stop offset={1} stopColor="#B8374D" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint4_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(17.0016 20.8243) rotate(-180) scale(2.54971 0.578414)"
>
<stop stopColor="#71568C" />
<stop offset={1} stopColor="#71568C" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint5_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(15.2083 12.838) rotate(73.3422) scale(3.57357 2.27278)"
>
<stop offset={0.342726} stopColor="#48135A" />
<stop offset={1} stopColor="#48135A" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint6_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(13.5016 8.10834) rotate(90) scale(7.41943 17.8831)"
>
<stop stopColor="#66C4FF" />
<stop offset={1} stopColor="#4DA4FB" />
</radialGradient>
<radialGradient
id="paint7_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(13.8363 12.255) rotate(-47.4895) scale(4.81224 6.09248)"
>
<stop stopColor="#68C7FF" />
<stop offset={1} stopColor="#68C7FF" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint8_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(15.1665 5.3574) rotate(137.603) scale(13.043 11.2578)"
>
<stop offset={0.914857} stopColor="#89D2FF" stopOpacity={0} />
<stop offset={1} stopColor="#89D2FF" />
</radialGradient>
<radialGradient
id="paint9_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(15.1911 13.6715) rotate(64.0989) scale(3.32732 1.7458)"
>
<stop offset={0.335515} stopColor="#84CBFF" />
<stop offset={1} stopColor="#84CBFF" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint10_linear_18_2953"
x1={3.00159}
y1={5.02777}
x2={24.0016}
y2={17.0278}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FA3D6A" />
<stop offset={1} stopColor="#FF38A8" />
</linearGradient>
<linearGradient
id="paint11_linear_18_2953"
x1={23.0553}
y1={7.0419}
x2={20.5809}
y2={9.56483}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FF77B7" />
<stop offset={1} stopColor="#FF77B7" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint12_linear_18_2953"
x1={5.3463}
y1={14.8038}
x2={6.63455}
y2={13.0788}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FF77B7" />
<stop offset={1} stopColor="#FF77B7" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint13_linear_18_2953"
x1={16.8814}
y1={14.0032}
x2={13.8796}
y2={13.2097}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FF77B7" />
<stop offset={1} stopColor="#FF77B7" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint14_linear_18_2953"
x1={27.4543}
y1={6.49664}
x2={27.4543}
y2={21.7618}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FF55A8" />
<stop offset={1} stopColor="#FF4C79" />
</linearGradient>
<linearGradient
id="paint15_linear_18_2953"
x1={26.5016}
y1={2.02777}
x2={26.5016}
y2={6.16351}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#332B39" />
<stop offset={1} stopColor="#462C5E" />
</linearGradient>
<radialGradient
id="paint16_radial_18_2953"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(27.5722 6.3876) rotate(-90) scale(5.59724 1.54834)"
>
<stop stopColor="#5A5260" />
<stop offset={1} stopColor="#5A5260" stopOpacity={0} />
</radialGradient>
</defs>
</svg>
);
module.exports = DivingMaskIcon;