@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
452 lines (451 loc) • 14.4 kB
JSX
const React = require("react");
const BreadIcon = ({ 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="M27.3408 25.5926L15 30V16.5L29 13V23.2382C29 24.2947 28.3358 25.2372 27.3408 25.5926Z"
fill="url(#paint0_linear_18_32476)"
/>
<path
d="M14.5898 3.26178L3.20215 7.55596L16.9999 19.0001L27.9812 15.1988C29.1895 14.7806 29.9999 13.6425 29.9999 12.3639V11.4604C29.9999 9.37851 28.7098 7.51446 26.7614 6.781L17.4103 3.26096C16.5012 2.91875 15.4987 2.91904 14.5898 3.26178Z"
fill="url(#paint1_linear_18_32476)"
/>
<path
d="M3 13.5V23.4553C3 24.6888 3.75499 25.7966 4.90304 26.2476L14.2687 29.927C15.5807 30.4424 17 29.4751 17 28.0654V19L17.1567 18.7649C17.7066 17.9401 18 16.971 18 15.9797C18 13.8866 16.7017 12.0131 14.7419 11.2782L4.70225 7.51331C3.39475 7.02299 2 7.98955 2 9.38596V10.7889C2 11.5786 2.23375 12.3506 2.6718 13.0077L3 13.5Z"
fill="url(#paint2_linear_18_32476)"
/>
<g filter="url(#filter0_f_18_32476)">
<path
d="M4.70227 7.51331L14.7419 11.2782C16.7017 12.0131 18 13.8866 18 15.9797C18 16.971 17.7066 17.9401 17.1567 18.7649L17 19V28.0654"
stroke="url(#paint3_linear_18_32476)"
strokeWidth={0.1}
/>
</g>
<path
d="M3.08278 13.5982V23.3977C3.08278 24.6119 3.82949 25.7023 4.96496 26.1463L14.2279 29.768C15.5256 30.2754 16.8281 29.3233 16.8281 27.9357V19.0121L16.9831 18.7807C17.5269 17.9688 17.8172 17.0149 17.8172 16.0391C17.8172 13.9788 16.6342 12.1346 14.6959 11.4112L4.76636 7.70525C3.4732 7.22262 2.09375 8.17404 2.09375 9.5486V10.9295C2.09375 11.7069 2.32494 12.4668 2.75818 13.1136L3.08278 13.5982Z"
fill="url(#paint4_radial_18_32476)"
/>
<path
d="M8 13.5664C8 13.8059 7.86184 14 7.69141 14C7.52097 14 7.38281 13.8059 7.38281 13.5664C7.38281 13.3269 7.41551 13.1445 7.58594 13.1445C7.75637 13.1445 8 13.3269 8 13.5664Z"
fill="#C4C4C4"
/>
<ellipse
cx={7.65279}
cy={13.5633}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 7.65279 13.5633)"
fill="url(#paint5_radial_18_32476)"
/>
<ellipse
cx={5.69186}
cy={14.5283}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 5.69186 14.5283)"
fill="url(#paint6_radial_18_32476)"
/>
<ellipse
cx={5.69186}
cy={17.4716}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 5.69186 17.4716)"
fill="url(#paint7_radial_18_32476)"
/>
<ellipse
cx={5.62936}
cy={21.4716}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 5.62936 21.4716)"
fill="url(#paint8_radial_18_32476)"
/>
<ellipse
cx={7.61373}
cy={20.4716}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 7.61373 20.4716)"
fill="url(#paint9_radial_18_32476)"
/>
<ellipse
cx={7.61373}
cy={16.4716}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 7.61373 16.4716)"
fill="url(#paint10_radial_18_32476)"
/>
<ellipse
cx={9.62154}
cy={15.4716}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 9.62154 15.4716)"
fill="url(#paint11_radial_18_32476)"
/>
<ellipse
cx={11.5704}
cy={14.5283}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 11.5704 14.5283)"
fill="url(#paint12_radial_18_32476)"
/>
<ellipse
cx={11.5001}
cy={18.5283}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 11.5001 18.5283)"
fill="url(#paint13_radial_18_32476)"
/>
<ellipse
cx={9.5704}
cy={19.5283}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 9.5704 19.5283)"
fill="url(#paint14_radial_18_32476)"
/>
<ellipse
cx={9.52352}
cy={23.3564}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 9.52352 23.3564)"
fill="url(#paint15_radial_18_32476)"
/>
<ellipse
cx={11.5001}
cy={22.3413}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 11.5001 22.3413)"
fill="url(#paint16_radial_18_32476)"
/>
<ellipse
cx={13.4296}
cy={24.4716}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 13.4296 24.4716)"
fill="url(#paint17_radial_18_32476)"
/>
<ellipse
cx={13.4296}
cy={21.417}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 13.4296 21.417)"
fill="url(#paint18_radial_18_32476)"
/>
<ellipse
cx={13.4649}
cy={17.5708}
rx={0.303538}
ry={0.457031}
transform="rotate(-17.9456 13.4649 17.5708)"
fill="url(#paint19_radial_18_32476)"
/>
<g filter="url(#filter1_f_18_32476)">
<path
d="M2.67188 8.28119C3.01562 7.82814 3.85428 7.53713 4.3125 7.67188C4.84375 7.8281 11.5104 10.3125 15.0625 11.6562C16.0991 12.0483 18.1562 13.9687 17.5938 16.8281"
stroke="url(#paint20_radial_18_32476)"
strokeWidth={0.1}
/>
</g>
<defs>
<filter
id="filter0_f_18_32476"
x={4.48469}
y={7.26643}
width={13.7654}
height={20.999}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.1}
result="effect1_foregroundBlur_18_32476"
/>
</filter>
<filter
id="filter1_f_18_32476"
x={2.53202}
y={7.48875}
width={15.3074}
height={9.44902}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.05}
result="effect1_foregroundBlur_18_32476"
/>
</filter>
<linearGradient
id="paint0_linear_18_32476"
x1={22}
y1={16.375}
x2={26.5}
y2={28}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#C3844A" />
<stop offset={0.677344} stopColor="#BC7B46" />
<stop offset={0.844716} stopColor="#895461" />
</linearGradient>
<linearGradient
id="paint1_linear_18_32476"
x1={13.75}
y1={3.00452}
x2={19.375}
y2={18.25}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.0249607} stopColor="#FFC173" />
<stop offset={0.101893} stopColor="#FFC974" />
<stop offset={0.644378} stopColor="#FFCB79" />
<stop offset={0.753786} stopColor="#FFBB6E" />
<stop offset={0.876296} stopColor="#E09F59" />
<stop offset={1} stopColor="#9C5C44" />
</linearGradient>
<linearGradient
id="paint2_linear_18_32476"
x1={1.6875}
y1={8.875}
x2={14.625}
y2={30.0674}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#DF994E" />
<stop offset={0.483328} stopColor="#E0994D" />
<stop offset={1} stopColor="#925440" />
</linearGradient>
<linearGradient
id="paint3_linear_18_32476"
x1={4.0625}
y1={7.75}
x2={15.7813}
y2={29.8437}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#DF9A4F" />
<stop offset={0.426934} stopColor="#E2994D" />
<stop offset={1} stopColor="#925440" />
</linearGradient>
<radialGradient
id="paint4_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(0.5 20.625) rotate(-20.596) scale(20.965 19.3732)"
>
<stop offset={0.350386} stopColor="#CAA177" />
<stop offset={1} stopColor="#BE977C" />
</radialGradient>
<radialGradient
id="paint5_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(7.08131 13.9336) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint6_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(5.12037 14.8986) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint7_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(5.12037 17.8419) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint8_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(5.05787 21.8419) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint9_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(7.04225 20.8419) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint10_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(7.04225 16.8419) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint11_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(9.05006 15.8419) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint12_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(10.9989 14.8986) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint13_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(10.9286 18.8986) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint14_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(8.99891 19.8986) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint15_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(8.95204 23.7267) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint16_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(10.9286 22.7116) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint17_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(12.8581 24.8419) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint18_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(12.8581 21.7872) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint19_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(12.8934 17.9411) rotate(-13.6423) scale(1.00862 0.669875)"
>
<stop stopColor="#AC8761" stopOpacity={0} />
<stop offset={1} stopColor="#956B54" />
</radialGradient>
<radialGradient
id="paint20_radial_18_32476"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(10.1807 10.3125) rotate(98.3186) scale(6.00063 13.6225)"
>
<stop stopColor="#F2CE97" />
<stop offset={1} stopColor="#FFEBCB" stopOpacity={0} />
</radialGradient>
</defs>
</svg>
);
module.exports = BreadIcon;