@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
444 lines (443 loc) • 16.9 kB
JSX
const React = require("react");
const RibbonIcon = ({ 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="M19.8798 29.3534L16.2419 19.3893L22.1638 15.9362L26.2029 27.0301C26.4266 27.6444 25.812 28.2308 25.2088 27.9786L23.37 27.2096C22.8782 27.004 22.3115 27.2202 22.0818 27.7012L21.2611 29.4195C20.9748 30.0191 20.1077 29.9776 19.8798 29.3534Z"
fill="url(#paint0_linear_18_1233)"
/>
<path
d="M19.8798 29.3534L16.2419 19.3893L22.1638 15.9362L26.2029 27.0301C26.4266 27.6444 25.812 28.2308 25.2088 27.9786L23.37 27.2096C22.8782 27.004 22.3115 27.2202 22.0818 27.7012L21.2611 29.4195C20.9748 30.0191 20.1077 29.9776 19.8798 29.3534Z"
fill="url(#paint1_linear_18_1233)"
/>
<path
d="M19.8798 29.3534L16.2419 19.3893L22.1638 15.9362L26.2029 27.0301C26.4266 27.6444 25.812 28.2308 25.2088 27.9786L23.37 27.2096C22.8782 27.004 22.3115 27.2202 22.0818 27.7012L21.2611 29.4195C20.9748 30.0191 20.1077 29.9776 19.8798 29.3534Z"
fill="url(#paint2_linear_18_1233)"
/>
<path
d="M19.8798 29.3534L16.2419 19.3893L22.1638 15.9362L26.2029 27.0301C26.4266 27.6444 25.812 28.2308 25.2088 27.9786L23.37 27.2096C22.8782 27.004 22.3115 27.2202 22.0818 27.7012L21.2611 29.4195C20.9748 30.0191 20.1077 29.9776 19.8798 29.3534Z"
fill="url(#paint3_linear_18_1233)"
/>
<path
d="M12.2134 29.3534L15.8513 19.3893L9.92944 15.9362L5.89034 27.0301C5.66669 27.6444 6.2813 28.2308 6.88444 27.9786L8.72331 27.2096C9.21509 27.004 9.78174 27.2202 10.0115 27.7012L10.8321 29.4195C11.1185 30.0191 11.9855 29.9776 12.2134 29.3534Z"
fill="url(#paint4_linear_18_1233)"
/>
<path
d="M12.2134 29.3534L15.8513 19.3893L9.92944 15.9362L5.89034 27.0301C5.66669 27.6444 6.2813 28.2308 6.88444 27.9786L8.72331 27.2096C9.21509 27.004 9.78174 27.2202 10.0115 27.7012L10.8321 29.4195C11.1185 30.0191 11.9855 29.9776 12.2134 29.3534Z"
fill="url(#paint5_radial_18_1233)"
/>
<path
d="M12.2134 29.3534L15.8513 19.3893L9.92944 15.9362L5.89034 27.0301C5.66669 27.6444 6.2813 28.2308 6.88444 27.9786L8.72331 27.2096C9.21509 27.004 9.78174 27.2202 10.0115 27.7012L10.8321 29.4195C11.1185 30.0191 11.9855 29.9776 12.2134 29.3534Z"
fill="url(#paint6_linear_18_1233)"
/>
<path
d="M12.2134 29.3534L15.8513 19.3893L9.92944 15.9362L5.89034 27.0301C5.66669 27.6444 6.2813 28.2308 6.88444 27.9786L8.72331 27.2096C9.21509 27.004 9.78174 27.2202 10.0115 27.7012L10.8321 29.4195C11.1185 30.0191 11.9855 29.9776 12.2134 29.3534Z"
fill="url(#paint7_linear_18_1233)"
/>
<path
d="M13.4225 9.72355L14.2522 9.32911L8.93186 6.71659C7.74787 6.10319 5.89806 5.53958 4.12769 6.42478C3.7712 6.60304 3.47052 6.81597 3.22137 7.05322C2.69428 7.51629 2.00479 8.42497 2.00479 10.0205V16.785C1.96316 17.3262 2.18387 18.7167 3.02299 19.494C4.13651 20.7049 6.2073 21.2242 8.49328 20.2211C9.69818 19.6925 11.2328 18.9166 12.235 18.4099C12.6387 18.2059 12.9562 18.0453 13.1307 17.9623L14.2522 17.4292L13.4225 17.0218V9.72355Z"
fill="url(#paint8_linear_18_1233)"
/>
<path
d="M13.4225 9.72355L14.2522 9.32911L8.93186 6.71659C7.74787 6.10319 5.89806 5.53958 4.12769 6.42478C3.7712 6.60304 3.47052 6.81597 3.22137 7.05322C2.69428 7.51629 2.00479 8.42497 2.00479 10.0205V16.785C1.96316 17.3262 2.18387 18.7167 3.02299 19.494C4.13651 20.7049 6.2073 21.2242 8.49328 20.2211C9.69818 19.6925 11.2328 18.9166 12.235 18.4099C12.6387 18.2059 12.9562 18.0453 13.1307 17.9623L14.2522 17.4292L13.4225 17.0218V9.72355Z"
fill="url(#paint9_radial_18_1233)"
/>
<path
d="M18.5172 9.72355L17.6875 9.32911L23.0078 6.71659C24.1918 6.10319 26.0416 5.53958 27.8119 6.42478C28.1684 6.60304 28.4691 6.81597 28.7183 7.05322C29.2454 7.51629 29.9348 8.42497 29.9348 10.0205V16.785C29.9765 17.3262 29.7558 18.7167 28.9166 19.494C27.8031 20.7049 25.7323 21.2242 23.4464 20.2211C22.2415 19.6925 20.7068 18.9166 19.7046 18.4099C19.301 18.2059 18.9834 18.0453 18.8089 17.9623L17.6875 17.4292L18.5172 17.0218V9.72355Z"
fill="url(#paint10_linear_18_1233)"
/>
<path
d="M8.66157 15.3524L12.8732 17.4205C12.2161 17.7328 9.94124 18.9306 8.25228 19.6717C6.14108 20.598 4.34223 20.0702 3.43743 19.0577C2.53263 18.0452 2.5262 15.9965 4.39611 15.0615C5.91271 14.3032 7.54134 14.7707 8.66157 15.3524Z"
fill="#C4C4C4"
fillOpacity={0.55}
/>
<path
d="M23.2782 15.3524L19.0666 17.4205C19.7236 17.7328 21.9985 18.9306 23.6875 19.6717C25.7987 20.598 27.5975 20.0702 28.5023 19.0577C29.4071 18.0452 29.4136 15.9965 27.5437 15.0615C26.027 14.3032 24.3984 14.7707 23.2782 15.3524Z"
fill="#C40E49"
/>
<path
d="M23.2782 15.3524L19.0666 17.4205C19.7236 17.7328 21.9985 18.9306 23.6875 19.6717C25.7987 20.598 27.5975 20.0702 28.5023 19.0577C29.4071 18.0452 29.4136 15.9965 27.5437 15.0615C26.027 14.3032 24.3984 14.7707 23.2782 15.3524Z"
fill="url(#paint11_radial_18_1233)"
/>
<path
d="M8.66157 15.3524L12.8732 17.4205C12.2161 17.7328 9.94124 18.9306 8.25228 19.6717C6.14108 20.598 4.34223 20.0702 3.43743 19.0577C2.53263 18.0452 2.5262 15.9965 4.39611 15.0615C5.91271 14.3032 7.54134 14.7707 8.66157 15.3524Z"
fill="#CC0B30"
/>
<path
d="M8.66157 15.3524L12.8732 17.4205C12.2161 17.7328 9.94124 18.9306 8.25228 19.6717C6.14108 20.598 4.34223 20.0702 3.43743 19.0577C2.53263 18.0452 2.5262 15.9965 4.39611 15.0615C5.91271 14.3032 7.54134 14.7707 8.66157 15.3524Z"
fill="url(#paint12_radial_18_1233)"
/>
<g filter="url(#filter0_i_18_1233)">
<path
d="M18.9378 17.6914L18.377 17.4248L18.9343 17.1512L23.143 15.0845C24.295 14.4871 26.0342 13.9714 27.6778 14.7932C29.7436 15.8261 29.7481 18.1139 28.726 19.2576C27.721 20.3823 25.7769 20.9161 23.5669 19.9464C22.3697 19.4211 20.8624 18.659 19.8606 18.1524C19.4486 17.9441 19.122 17.779 18.9378 17.6914Z"
stroke="url(#paint13_linear_18_1233)"
strokeWidth={0.6}
/>
</g>
<g filter="url(#filter1_i_18_1233)">
<path
d="M13.002 17.6914L13.5627 17.4248L13.0054 17.1512L8.79679 15.0845C7.64478 14.4871 5.90551 13.9714 4.26194 14.7932C2.19616 15.8261 2.19171 18.1139 3.21374 19.2576C4.21877 20.3823 6.16283 20.9161 8.37282 19.9464C9.57009 19.4211 11.0774 18.659 12.0792 18.1524C12.4912 17.9441 12.8177 17.779 13.002 17.6914Z"
stroke="url(#paint14_linear_18_1233)"
strokeWidth={0.6}
/>
</g>
<path
d="M18.9378 17.6914L18.377 17.4248L18.9343 17.1512L23.143 15.0845C24.295 14.4871 26.0342 13.9714 27.6778 14.7932C29.7436 15.8261 29.7481 18.1139 28.726 19.2576C27.721 20.3823 25.7769 20.9161 23.5669 19.9464C22.3697 19.4211 20.8624 18.659 19.8606 18.1524C19.4486 17.9441 19.122 17.779 18.9378 17.6914Z"
stroke="url(#paint15_radial_18_1233)"
strokeWidth={0.6}
/>
<rect
x={12.6039}
y={7.11223}
width={6.91525}
height={12.9903}
rx={1.85}
fill="url(#paint16_linear_18_1233)"
/>
<rect
x={12.6039}
y={7.11223}
width={6.91525}
height={12.9903}
rx={1.85}
fill="url(#paint17_linear_18_1233)"
/>
<rect
x={12.6039}
y={7.11223}
width={6.91525}
height={12.9903}
rx={1.85}
fill="url(#paint18_radial_18_1233)"
/>
<rect
x={12.6039}
y={7.11223}
width={6.91525}
height={12.9903}
rx={1.85}
fill="url(#paint19_linear_18_1233)"
/>
<rect
x={12.6039}
y={7.11223}
width={6.91525}
height={12.9903}
rx={1.85}
fill="url(#paint20_linear_18_1233)"
/>
<defs>
<filter
id="filter0_i_18_1233"
x={17.6875}
y={14.0665}
width={12.006}
height={6.78495}
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.1} />
<feGaussianBlur stdDeviation={0.1} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.811765 0 0 0 0 0.254902 0 0 0 0 0.388235 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_1233"
/>
</filter>
<filter
id="filter1_i_18_1233"
x={2.24622}
y={14.0665}
width={12.006}
height={6.78495}
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.1} />
<feGaussianBlur stdDeviation={0.1} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.843137 0 0 0 0 0.25098 0 0 0 0 0.341176 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_1233"
/>
</filter>
<linearGradient
id="paint0_linear_18_1233"
x1={18.3044}
y1={19.7018}
x2={21.6794}
y2={28.0143}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#BA2950" />
<stop offset={1} stopColor="#DB1532" />
</linearGradient>
<linearGradient
id="paint1_linear_18_1233"
x1={22.2888}
y1={18.2643}
x2={20.3513}
y2={21.5768}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.283466} stopColor="#980129" />
<stop offset={1} stopColor="#980129" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint2_linear_18_1233"
x1={17.3779}
y1={22.6232}
x2={17.8053}
y2={22.478}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A80435" />
<stop offset={1} stopColor="#A80435" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint3_linear_18_1233"
x1={24.9928}
y1={23.4608}
x2={24.6168}
y2={23.5975}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E04E6F" />
<stop offset={1} stopColor="#E04E6F" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint4_linear_18_1233"
x1={13.7888}
y1={19.7018}
x2={10.4138}
y2={28.0143}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#BA2950" />
<stop offset={1} stopColor="#DB1532" />
</linearGradient>
<radialGradient
id="paint5_radial_18_1233"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(14.6638 17.5143) rotate(129.152) scale(6.04469 6.91506)"
>
<stop offset={0.289654} stopColor="#980129" />
<stop offset={1} stopColor="#980129" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint6_linear_18_1233"
x1={7.63653}
y1={21.9698}
x2={8.16594}
y2={22.1649}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#AA3244" />
<stop offset={1} stopColor="#AA3244" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint7_linear_18_1233"
x1={14.2441}
y1={24.1835}
x2={13.8645}
y2={24.034}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.175676} stopColor="#D24162" />
<stop offset={1} stopColor="#D24162" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint8_linear_18_1233"
x1={12.9138}
y1={13.8893}
x2={2}
y2={13.8893}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#C92D60" />
<stop offset={0.496726} stopColor="#CD2E4E" />
<stop offset={1} stopColor="#A1383E" />
</linearGradient>
<radialGradient
id="paint9_radial_18_1233"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(10.4763 17.5143) rotate(-90) scale(9.9375 3.23171)"
>
<stop stopColor="#DB3665" />
<stop offset={1} stopColor="#DB3665" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint10_linear_18_1233"
x1={20.4762}
y1={14.0143}
x2={29.9396}
y2={14.0143}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.0924616} stopColor="#A52548" />
<stop offset={1} stopColor="#EC4953" />
</linearGradient>
<radialGradient
id="paint11_radial_18_1233"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(27.6251 12.0769) rotate(79.0889) scale(8.66897 11.8263)"
>
<stop offset={0.656541} stopColor="#932128" />
<stop offset={1} stopColor="#932128" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint12_radial_18_1233"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(4.31468 12.0769) rotate(100.911) scale(8.66897 11.8263)"
>
<stop offset={0.656541} stopColor="#97242A" />
<stop offset={1} stopColor="#932128" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint13_linear_18_1233"
x1={19.0666}
y1={17.7518}
x2={29.813}
y2={17.7518}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#BB1865" />
<stop offset={1} stopColor="#DD1836" />
</linearGradient>
<linearGradient
id="paint14_linear_18_1233"
x1={12.8732}
y1={17.7518}
x2={2.12679}
y2={17.7518}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#C31867" />
<stop offset={1} stopColor="#C81745" />
</linearGradient>
<radialGradient
id="paint15_radial_18_1233"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(24.6013 19.1706) rotate(-50.6901) scale(5.82071 6.60842)"
>
<stop offset={0.827753} stopColor="#EC4C5C" stopOpacity={0} />
<stop offset={1} stopColor="#EC4C5C" />
</radialGradient>
<linearGradient
id="paint16_linear_18_1233"
x1={16.0615}
y1={7.11223}
x2={16.0615}
y2={20.1026}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#C83065" />
<stop offset={1} stopColor="#DF1E30" />
</linearGradient>
<linearGradient
id="paint17_linear_18_1233"
x1={11.7326}
y1={12.703}
x2={14.3883}
y2={12.8893}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A2304B" />
<stop offset={1} stopColor="#A2304B" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint18_radial_18_1233"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(20.1192 17.5486) rotate(180) scale(4.61266 0.652294)"
>
<stop stopColor="#F75053" />
<stop offset={1} stopColor="#F75053" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint19_linear_18_1233"
x1={19.6766}
y1={12.7496}
x2={18.6748}
y2={12.7496}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#C11451" />
<stop offset={1} stopColor="#C11451" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint20_linear_18_1233"
x1={16.718}
y1={20.5771}
x2={16.718}
y2={18.6668}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#D12951" />
<stop offset={1} stopColor="#D12951" stopOpacity={0} />
</linearGradient>
</defs>
</svg>
);
module.exports = RibbonIcon;