@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
427 lines (426 loc) • 14.9 kB
JSX
const React = require("react");
const BubbleTeaIcon = ({ 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}
<path d="M17 2H15V8H17V2Z" fill="url(#paint0_linear_18_32395)" />
<path
d="M7.2 11L7.5 11.25H24.5L24.8 11L25 9L24.8 8.75H7.2L7 9L7.2 11Z"
fill="#B4DBFF"
/>
<path
d="M7.2 11L7.5 11.25H24.5L24.8 11L25 9L24.8 8.75H7.2L7 9L7.2 11Z"
fill="url(#paint1_linear_18_32395)"
/>
<path
d="M7.2 11L7.5 11.25H24.5L24.8 11L25 9L24.8 8.75H7.2L7 9L7.2 11Z"
fill="url(#paint2_linear_18_32395)"
/>
<path
d="M7 8H25"
stroke="#A0C9FF"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M7 8H25"
stroke="url(#paint3_radial_18_32395)"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M7 8H25"
stroke="url(#paint4_radial_18_32395)"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M7 8H25"
stroke="url(#paint5_radial_18_32395)"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M7 8H25"
stroke="url(#paint6_linear_18_32395)"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M7.2 11L9 29C9.07587 29.5633 9.5 30 10 30H22C22.5 30 22.9026 29.6055 23 29L24.8 11H7.2Z"
fill="#EB9C5B"
/>
<path
d="M7.2 11L9 29C9.07587 29.5633 9.5 30 10 30H22C22.5 30 22.9026 29.6055 23 29L24.8 11H7.2Z"
fill="url(#paint7_radial_18_32395)"
/>
<path
d="M7.2 11L9 29C9.07587 29.5633 9.5 30 10 30H22C22.5 30 22.9026 29.6055 23 29L24.8 11H7.2Z"
fill="url(#paint8_radial_18_32395)"
/>
<path
d="M7.2 11L9 29C9.07587 29.5633 9.5 30 10 30H22C22.5 30 22.9026 29.6055 23 29L24.8 11H7.2Z"
fill="url(#paint9_radial_18_32395)"
/>
<path
d="M18.59 25.8075C19.3135 25.8075 19.9 25.221 19.9 24.4975C19.9 23.774 19.3135 23.1875 18.59 23.1875C17.8665 23.1875 17.28 23.774 17.28 24.4975C17.28 25.221 17.8665 25.8075 18.59 25.8075Z"
fill="url(#paint10_radial_18_32395)"
/>
<path
d="M18.59 25.8075C19.3135 25.8075 19.9 25.221 19.9 24.4975C19.9 23.774 19.3135 23.1875 18.59 23.1875C17.8665 23.1875 17.28 23.774 17.28 24.4975C17.28 25.221 17.8665 25.8075 18.59 25.8075Z"
fill="url(#paint11_radial_18_32395)"
/>
<path
d="M13.4437 25.8075C14.1672 25.8075 14.7537 25.221 14.7537 24.4975C14.7537 23.774 14.1672 23.1875 13.4437 23.1875C12.7202 23.1875 12.1337 23.774 12.1337 24.4975C12.1337 25.221 12.7202 25.8075 13.4437 25.8075Z"
fill="url(#paint12_radial_18_32395)"
/>
<path
d="M13.4437 25.8075C14.1672 25.8075 14.7537 25.221 14.7537 24.4975C14.7537 23.774 14.1672 23.1875 13.4437 23.1875C12.7202 23.1875 12.1337 23.774 12.1337 24.4975C12.1337 25.221 12.7202 25.8075 13.4437 25.8075Z"
fill="url(#paint13_radial_18_32395)"
/>
<path
d="M20.442 28.7325C21.1655 28.7325 21.752 28.146 21.752 27.4225C21.752 26.699 21.1655 26.1125 20.442 26.1125C19.7185 26.1125 19.132 26.699 19.132 27.4225C19.132 28.146 19.7185 28.7325 20.442 28.7325Z"
fill="url(#paint14_radial_18_32395)"
/>
<path
d="M20.442 28.7325C21.1655 28.7325 21.752 28.146 21.752 27.4225C21.752 26.699 21.1655 26.1125 20.442 26.1125C19.7185 26.1125 19.132 26.699 19.132 27.4225C19.132 28.146 19.7185 28.7325 20.442 28.7325Z"
fill="url(#paint15_radial_18_32395)"
/>
<path
d="M15.97 28.7325C16.6935 28.7325 17.28 28.146 17.28 27.4225C17.28 26.699 16.6935 26.1125 15.97 26.1125C15.2465 26.1125 14.66 26.699 14.66 27.4225C14.66 28.146 15.2465 28.7325 15.97 28.7325Z"
fill="url(#paint16_radial_18_32395)"
/>
<path
d="M15.97 28.7325C16.6935 28.7325 17.28 28.146 17.28 27.4225C17.28 26.699 16.6935 26.1125 15.97 26.1125C15.2465 26.1125 14.66 26.699 14.66 27.4225C14.66 28.146 15.2465 28.7325 15.97 28.7325Z"
fill="url(#paint17_radial_18_32395)"
/>
<path
d="M11.4975 28.7325C12.221 28.7325 12.8075 28.146 12.8075 27.4225C12.8075 26.699 12.221 26.1125 11.4975 26.1125C10.774 26.1125 10.1875 26.699 10.1875 27.4225C10.1875 28.146 10.774 28.7325 11.4975 28.7325Z"
fill="url(#paint18_radial_18_32395)"
/>
<path
d="M11.4975 28.7325C12.221 28.7325 12.8075 28.146 12.8075 27.4225C12.8075 26.699 12.221 26.1125 11.4975 26.1125C10.774 26.1125 10.1875 26.699 10.1875 27.4225C10.1875 28.146 10.774 28.7325 11.4975 28.7325Z"
fill="url(#paint19_radial_18_32395)"
/>
<path opacity={0.75} d="M17 9H15V11H17V9Z" fill="#9679BB" />
<path d="M17 9H15V11H17V9Z" fill="url(#paint20_linear_18_32395)" />
<path opacity={0.75} d="M17 7H15V9H17V7Z" fill="#BCA4EB" />
<path d="M17 7H15V9H17V7Z" fill="url(#paint21_linear_18_32395)" />
<path d="M17 7H15V9H17V7Z" fill="url(#paint22_linear_18_32395)" />
<path d="M17 7H15V9H17V7Z" fill="url(#paint23_linear_18_32395)" />
<path d="M17 7H15V9H17V7Z" fill="url(#paint24_radial_18_32395)" />
<path
d="M20.0437 23.6112L21.0337 13.91C21.0737 13.4 21.5137 13 22.0237 13C22.6037 13 23.0637 13.5 23.0137 14.08L22.0237 23.7812C21.9837 24.3012 21.5537 24.6912 21.0337 24.6912C20.4537 24.6912 19.9937 24.1912 20.0437 23.6112Z"
fill="url(#paint25_linear_18_32395)"
/>
<defs>
<linearGradient
id="paint0_linear_18_32395"
x1={15}
y1={5.71875}
x2={17}
y2={5.71875}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#785FAB" />
<stop offset={0.265625} stopColor="#7D5EB4" />
<stop offset={0.710938} stopColor="#A081D7" />
<stop offset={1} stopColor="#9C7ED5" />
</linearGradient>
<linearGradient
id="paint1_linear_18_32395"
x1={7}
y1={10.375}
x2={8.46875}
y2={10.2188}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A1BDDB" />
<stop offset={1} stopColor="#A1C2E5" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint2_linear_18_32395"
x1={25}
y1={10}
x2={23.5938}
y2={9.85937}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A1BDDB" />
<stop offset={1} stopColor="#A1C2E5" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint3_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(21.9062 7.625) rotate(87.2737) scale(0.656994 9.32931)"
>
<stop offset={0.19251} stopColor="#CEF7FF" />
<stop offset={1} stopColor="#CEF7FF" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint4_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(10.1875 8.1875) rotate(88.8543) scale(0.781406 13.3327)"
>
<stop offset={0.19251} stopColor="#C1E5FF" />
<stop offset={0.572917} stopColor="#AED6FE" />
<stop offset={1} stopColor="#A9D2FB" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint5_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(16 8) rotate(90) scale(4.75 11.4375)"
>
<stop offset={0.644737} stopColor="#A8C1E0" stopOpacity={0} />
<stop offset={0.868421} stopColor="#A3C4E9" />
</radialGradient>
<linearGradient
id="paint6_linear_18_32395"
x1={16}
y1={8.51563}
x2={16}
y2={9}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#99B7E6" stopOpacity={0} />
<stop offset={1} stopColor="#9AB7E8" />
</linearGradient>
<radialGradient
id="paint7_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(20.5 17.375) rotate(91.5967) scale(35.8889 14.5013)"
>
<stop offset={0.0293936} stopColor="#FFBB85" />
<stop offset={0.277462} stopColor="#F5A07F" />
<stop offset={1} stopColor="#DA8664" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint8_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(21.375 26.75) rotate(90) scale(9.125 27.375)"
>
<stop stopColor="#FFD4A4" />
<stop offset={1} stopColor="#FFB09B" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint9_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(4.875 11.75) rotate(91.4057) scale(20.3811 14.005)"
>
<stop stopColor="#C77F51" />
<stop offset={1} stopColor="#CC7C4A" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint10_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(19.1463 24.0313) rotate(137.021) scale(1.87942)"
>
<stop stopColor="#9D6F6C" />
<stop offset={0.949671} stopColor="#774A43" />
</radialGradient>
<radialGradient
id="paint11_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(18.59 25.625) rotate(90) scale(1.375 1.95293)"
>
<stop stopColor="#803863" />
<stop offset={1} stopColor="#854460" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint12_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(14 24.0313) rotate(137.021) scale(1.87942)"
>
<stop stopColor="#9D6F6C" />
<stop offset={0.949671} stopColor="#774A43" />
</radialGradient>
<radialGradient
id="paint13_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(13.4437 25.625) rotate(90) scale(1.375 1.95293)"
>
<stop stopColor="#803863" />
<stop offset={1} stopColor="#854460" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint14_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(20.9983 26.9562) rotate(137.021) scale(1.87942)"
>
<stop stopColor="#9D6F6C" />
<stop offset={0.949671} stopColor="#774A43" />
</radialGradient>
<radialGradient
id="paint15_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(20.442 28.55) rotate(90) scale(1.375 1.95293)"
>
<stop stopColor="#803863" />
<stop offset={1} stopColor="#854460" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint16_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(16.5263 26.9562) rotate(137.021) scale(1.87942)"
>
<stop stopColor="#9D6F6C" />
<stop offset={0.949671} stopColor="#774A43" />
</radialGradient>
<radialGradient
id="paint17_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(15.97 28.55) rotate(90) scale(1.375 1.95293)"
>
<stop stopColor="#803863" />
<stop offset={1} stopColor="#854460" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint18_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(12.0538 26.9562) rotate(137.021) scale(1.87942)"
>
<stop stopColor="#9D6F6C" />
<stop offset={0.949671} stopColor="#774A43" />
</radialGradient>
<radialGradient
id="paint19_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(11.4975 28.55) rotate(90) scale(1.375 1.95293)"
>
<stop stopColor="#803863" />
<stop offset={1} stopColor="#854460" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint20_linear_18_32395"
x1={15}
y1={10.2396}
x2={17}
y2={10.2396}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#9782BA" />
<stop offset={0.265625} stopColor="#9678BC" />
<stop offset={0.710938} stopColor="#AB8DD6" />
<stop offset={1} stopColor="#A794DB" />
</linearGradient>
<linearGradient
id="paint21_linear_18_32395"
x1={15}
y1={8.23958}
x2={17}
y2={8.23958}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#9782BA" />
<stop offset={0.265625} stopColor="#9678BC" />
<stop offset={0.710938} stopColor="#AB8DD6" />
<stop offset={1} stopColor="#A794DB" />
</linearGradient>
<linearGradient
id="paint22_linear_18_32395"
x1={16}
y1={6.78125}
x2={16}
y2={7.21875}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#AB98CA" />
<stop offset={1} stopColor="#BDACDA" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint23_linear_18_32395"
x1={15.9805}
y1={8.82813}
x2={15.9609}
y2={9.05859}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#8563A9" stopOpacity={0} />
<stop offset={1} stopColor="#8965AF" />
</linearGradient>
<radialGradient
id="paint24_radial_18_32395"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(15.9609 8.04687) rotate(86.2359) scale(0.595034 5.77945)"
>
<stop stopColor="#B398DC" />
<stop offset={1} stopColor="#B197D9" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint25_linear_18_32395"
x1={21.4587}
y1={13}
x2={21.4587}
y2={28}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FFFFFA" />
<stop offset={0.829166} stopColor="#FFFFFA" stopOpacity={0} />
</linearGradient>
</defs>
</svg>
);
module.exports = BubbleTeaIcon;