@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
131 lines (130 loc) • 4.14 kB
JSX
const React = require("react");
const CustardIcon = ({ 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="M7.97 16.47L5.61 26H26.38L24.08 16.48C23.88 15.61 23.1 15 22.21 15H9.84C8.96 15 8.18 15.61 7.97 16.47Z"
fill="url(#paint0_linear_18_31334)"
/>
<path
d="M9.84 15C8.96 15 8.18 15.61 7.97 16.47L7.34 19H24.7L24.09 16.48C23.88 15.61 23.1 15 22.21 15H9.84Z"
fill="url(#paint1_linear_18_31334)"
/>
<path
d="M4 28C5.28 29.28 7.02 30 8.83 30H23.17C24.98 30 26.72 29.28 28 28H4Z"
fill="url(#paint2_linear_18_31334)"
/>
<path
d="M4 28C5.28 29.28 7.02 30 8.83 30H23.17C24.98 30 26.72 29.28 28 28H4Z"
fill="url(#paint3_linear_18_31334)"
/>
<path
d="M29 28H3C2.45 28 2 27.55 2 27C2 26.45 2.45 26 3 26H29C29.55 26 30 26.45 30 27C30 27.55 29.55 28 29 28Z"
fill="url(#paint4_linear_18_31334)"
/>
<path
d="M29 28H3C2.45 28 2 27.55 2 27C2 26.45 2.45 26 3 26H29C29.55 26 30 26.45 30 27C30 27.55 29.55 28 29 28Z"
fill="url(#paint5_radial_18_31334)"
/>
<path
d="M29 28H3C2.45 28 2 27.55 2 27C2 26.45 2.45 26 3 26H29C29.55 26 30 26.45 30 27C30 27.55 29.55 28 29 28Z"
fill="url(#paint6_radial_18_31334)"
/>
<defs>
<linearGradient
id="paint0_linear_18_31334"
x1={5.61}
y1={26}
x2={26.38}
y2={26}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#946B53" />
<stop offset={0.247472} stopColor="#A66C3A" />
<stop offset={0.53635} stopColor="#CC8B53" />
<stop offset={0.753009} stopColor="#E0A56C" />
<stop offset={0.864348} stopColor="#E6A567" />
<stop offset={1} stopColor="#CC9968" />
</linearGradient>
<linearGradient
id="paint1_linear_18_31334"
x1={7.8125}
y1={17.3125}
x2={24.7}
y2={17.3125}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#714C40" />
<stop offset={0.247965} stopColor="#7A4A39" />
<stop offset={0.492228} stopColor="#955F4B" />
<stop offset={0.784604} stopColor="#B4806B" />
<stop offset={1} stopColor="#AC7962" />
</linearGradient>
<linearGradient
id="paint2_linear_18_31334"
x1={4.375}
y1={30}
x2={28}
y2={30}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#AD99C1" />
<stop offset={1} stopColor="#AD96C3" />
</linearGradient>
<linearGradient
id="paint3_linear_18_31334"
x1={16.2813}
y1={26.5469}
x2={16.25}
y2={28.4688}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.729399} stopColor="#9883AC" />
<stop offset={1} stopColor="#9C84B4" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint4_linear_18_31334"
x1={2}
y1={27}
x2={30.3125}
y2={27}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#868589" />
<stop offset={0.514349} stopColor="#ACAAAC" />
<stop offset={1} stopColor="#BCB9C2" />
</linearGradient>
<radialGradient
id="paint5_radial_18_31334"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(26.1875 26.7187) rotate(90) scale(0.78125 14.5)"
>
<stop stopColor="#DDDAE4" />
<stop offset={1} stopColor="#DEDBE4" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint6_radial_18_31334"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(11.1875 28) rotate(90) scale(1.5625 60.1813)"
>
<stop stopColor="#AF98C5" />
<stop offset={1} stopColor="#AE98C5" stopOpacity={0} />
</radialGradient>
</defs>
</svg>
);
module.exports = CustardIcon;