@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
188 lines (187 loc) • 7.55 kB
JSX
const React = require("react");
const LeftSpeechBubbleIcon = ({ 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 clipPath="url(#clip0_7155_6142)">
<g filter="url(#filter0_i_7155_6142)">
<path
d="M29.4966 14.5404C27.5625 10.75 23.1144 6.26831 16 6.26831C8.86582 6.26831 4.46877 10.5156 2.54302 14.58C2.0186 15.4309 1.99881 16.4501 2.50344 17.3109C5.00684 21.635 8.88561 25.583 16 25.583C16.9468 25.583 17.8781 25.5416 18.7295 25.4207C19.1896 25.3554 19.6634 25.4135 20.0723 25.6343C21.2265 26.2576 22.3871 26.9337 23.8664 27.7698C24.3216 28.0271 24.8757 27.6807 24.846 27.1563L24.6296 23.7478C24.5975 23.2423 24.8264 22.7589 25.2139 22.4326C26.9431 20.9768 28.299 19.1442 29.457 17.2615C29.9814 16.4105 30.0012 15.4012 29.4966 14.5404Z"
fill="url(#paint0_radial_7155_6142)"
/>
<path
d="M29.4966 14.5404C27.5625 10.75 23.1144 6.26831 16 6.26831C8.86582 6.26831 4.46877 10.5156 2.54302 14.58C2.0186 15.4309 1.99881 16.4501 2.50344 17.3109C5.00684 21.635 8.88561 25.583 16 25.583C16.9468 25.583 17.8781 25.5416 18.7295 25.4207C19.1896 25.3554 19.6634 25.4135 20.0723 25.6343C21.2265 26.2576 22.3871 26.9337 23.8664 27.7698C24.3216 28.0271 24.8757 27.6807 24.846 27.1563L24.6296 23.7478C24.5975 23.2423 24.8264 22.7589 25.2139 22.4326C26.9431 20.9768 28.299 19.1442 29.457 17.2615C29.9814 16.4105 30.0012 15.4012 29.4966 14.5404Z"
fill="url(#paint1_radial_7155_6142)"
/>
<path
d="M29.4966 14.5404C27.5625 10.75 23.1144 6.26831 16 6.26831C8.86582 6.26831 4.46877 10.5156 2.54302 14.58C2.0186 15.4309 1.99881 16.4501 2.50344 17.3109C5.00684 21.635 8.88561 25.583 16 25.583C16.9468 25.583 17.8781 25.5416 18.7295 25.4207C19.1896 25.3554 19.6634 25.4135 20.0723 25.6343C21.2265 26.2576 22.3871 26.9337 23.8664 27.7698C24.3216 28.0271 24.8757 27.6807 24.846 27.1563L24.6296 23.7478C24.5975 23.2423 24.8264 22.7589 25.2139 22.4326C26.9431 20.9768 28.299 19.1442 29.457 17.2615C29.9814 16.4105 30.0012 15.4012 29.4966 14.5404Z"
fill="url(#paint2_linear_7155_6142)"
/>
<path
d="M29.4966 14.5404C27.5625 10.75 23.1144 6.26831 16 6.26831C8.86582 6.26831 4.46877 10.5156 2.54302 14.58C2.0186 15.4309 1.99881 16.4501 2.50344 17.3109C5.00684 21.635 8.88561 25.583 16 25.583C16.9468 25.583 17.8781 25.5416 18.7295 25.4207C19.1896 25.3554 19.6634 25.4135 20.0723 25.6343C21.2265 26.2576 22.3871 26.9337 23.8664 27.7698C24.3216 28.0271 24.8757 27.6807 24.846 27.1563L24.6296 23.7478C24.5975 23.2423 24.8264 22.7589 25.2139 22.4326C26.9431 20.9768 28.299 19.1442 29.457 17.2615C29.9814 16.4105 30.0012 15.4012 29.4966 14.5404Z"
fill="url(#paint3_radial_7155_6142)"
/>
</g>
<g filter="url(#filter1_f_7155_6142)">
<path
d="M24.0833 20.8323L24.3696 26.6498C24.3814 26.8893 24.0818 27.0064 23.9281 26.8224L20.2813 22.4573L22.625 18.926L24.0833 20.8323Z"
fill="url(#paint4_linear_7155_6142)"
/>
</g>
<g filter="url(#filter2_f_7155_6142)">
<ellipse
rx={8.71983}
ry={5.68953}
transform="matrix(-1 0 0 1 13.6239 16.0001)"
fill="#EBE4FB"
fillOpacity={0.75}
/>
</g>
</g>
<defs>
<filter
id="filter0_i_7155_6142"
x={2.13702}
y={6.26831}
width={27.726}
height={21.5984}
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 dy={0.01} />
<feGaussianBlur stdDeviation={0.25} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.758333 0 0 0 0 0.758333 0 0 0 0 0.758333 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_7155_6142"
/>
</filter>
<filter
id="filter1_f_7155_6142"
x={19.2813}
y={17.926}
width={6.08868}
height={9.98657}
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_7155_6142"
/>
</filter>
<filter
id="filter2_f_7155_6142"
x={-0.0958862}
y={5.31055}
width={27.4397}
height={21.3792}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={2.5}
result="effect1_foregroundBlur_7155_6142"
/>
</filter>
<radialGradient
id="paint0_radial_7155_6142"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(11.8125 12.0511) rotate(69.444) scale(24.03 44.8268)"
>
<stop stopColor="white" />
<stop offset={1} stopColor="#D7C6DE" />
</radialGradient>
<radialGradient
id="paint1_radial_7155_6142"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(21.25 25.0511) rotate(-149.997) scale(27.4972 39.7665)"
>
<stop offset={0.615623} stopColor="#CECECE" stopOpacity={0} />
<stop offset={0.827013} stopColor="#CECECE" />
</radialGradient>
<linearGradient
id="paint2_linear_7155_6142"
x1={27.5671}
y1={-8.51513}
x2={10.1875}
y2={29.7386}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.7314} stopColor="#B6A8F2" stopOpacity={0} />
<stop offset={0.986396} stopColor="#B6A8F2" />
</linearGradient>
<radialGradient
id="paint3_radial_7155_6142"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(29.863 24.5511) rotate(10.5948) scale(5.09895 8.54596)"
>
<stop stopColor="#B6A8F2" />
<stop offset={1} stopColor="#B6A8F2" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint4_linear_7155_6142"
x1={21.9034}
y1={27.2947}
x2={18.9813}
y2={21.8216}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="white" />
<stop offset={0.778709} stopColor="white" stopOpacity={0} />
</linearGradient>
<clipPath id="clip0_7155_6142">
<rect width={32} height={32} fill="white" />
</clipPath>
</defs>
</svg>
);
module.exports = LeftSpeechBubbleIcon;