@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
414 lines (413 loc) • 14.8 kB
JSX
const React = require("react");
const EnvelopeWithArrowIcon = ({ 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}
<rect
x={2.09375}
y={10.0027}
width={27.8125}
height={19.9375}
rx={1.75}
fill="url(#paint0_linear_18_21855)"
/>
<rect
x={2.09375}
y={10.0027}
width={27.8125}
height={19.9375}
rx={1.75}
fill="url(#paint1_linear_18_21855)"
/>
<path
d="M16 10.0027V29.9402H3.84375C2.87726 29.9402 2.09375 29.1567 2.09375 28.1902V11.7527C2.09375 10.7862 2.87726 10.0027 3.84375 10.0027H16Z"
fill="url(#paint2_linear_18_21855)"
/>
<path
d="M16 10.0027V29.9402H3.84375C2.87726 29.9402 2.09375 29.1567 2.09375 28.1902V11.7527C2.09375 10.7862 2.87726 10.0027 3.84375 10.0027H16Z"
fill="url(#paint3_radial_18_21855)"
/>
<path
d="M16 10.0027V29.9402H28.1562C29.1227 29.9402 29.9062 29.1567 29.9062 28.1902V11.7527C29.9062 10.7862 29.1227 10.0027 28.1562 10.0027H16Z"
fill="url(#paint4_linear_18_21855)"
/>
<path
d="M16 10.0027V29.9402H28.1562C29.1227 29.9402 29.9062 29.1567 29.9062 28.1902V11.7527C29.9062 10.7862 29.1227 10.0027 28.1562 10.0027H16Z"
fill="url(#paint5_linear_18_21855)"
/>
<path
d="M16 10.0027V29.9402H28.1562C29.1227 29.9402 29.9062 29.1567 29.9062 28.1902V11.7527C29.9062 10.7862 29.1227 10.0027 28.1562 10.0027H16Z"
fill="url(#paint6_linear_18_21855)"
/>
<path
d="M16 10.0027V29.9402H28.1562C29.1227 29.9402 29.9062 29.1567 29.9062 28.1902V11.7527C29.9062 10.7862 29.1227 10.0027 28.1562 10.0027H16Z"
fill="url(#paint7_linear_18_21855)"
/>
<g filter="url(#filter0_i_18_21855)">
<path
d="M2.09375 28.1902C2.09375 27.9277 2.22895 27.6838 2.45151 27.5447L15.7799 19.2135C15.9097 19.1324 16.0746 19.1324 16.2043 19.2138L29.5771 27.5955C29.7819 27.7238 29.9062 27.9485 29.9062 28.1902V28.1902C29.9062 29.1567 29.1227 29.9402 28.1562 29.9402H3.84375C2.87726 29.9402 2.09375 29.1567 2.09375 28.1902V28.1902Z"
fill="url(#paint8_linear_18_21855)"
/>
</g>
<path
d="M2.09375 28.1902C2.09375 27.9277 2.22895 27.6838 2.45151 27.5447L15.7799 19.2135C15.9097 19.1324 16.0746 19.1324 16.2043 19.2138L29.5771 27.5955C29.7819 27.7238 29.9062 27.9485 29.9062 28.1902V28.1902C29.9062 29.1567 29.1227 29.9402 28.1562 29.9402H3.84375C2.87726 29.9402 2.09375 29.1567 2.09375 28.1902V28.1902Z"
fill="url(#paint9_linear_18_21855)"
/>
<path
d="M2.09375 28.1902C2.09375 27.9277 2.22895 27.6838 2.45151 27.5447L15.7799 19.2135C15.9097 19.1324 16.0746 19.1324 16.2043 19.2138L29.5771 27.5955C29.7819 27.7238 29.9062 27.9485 29.9062 28.1902V28.1902C29.9062 29.1567 29.1227 29.9402 28.1562 29.9402H3.84375C2.87726 29.9402 2.09375 29.1567 2.09375 28.1902V28.1902Z"
fill="url(#paint10_linear_18_21855)"
/>
<g filter="url(#filter1_ii_18_21855)">
<path
d="M2.09375 11.7527C2.09375 12.0151 2.22895 12.2591 2.45151 12.3982L15.7799 20.7294C15.9097 20.8105 16.0746 20.8104 16.2043 20.7291L29.5771 12.3474C29.7819 12.219 29.9062 11.9944 29.9062 11.7527V11.7527C29.9062 10.7862 29.1227 10.0027 28.1562 10.0027H3.84375C2.87726 10.0027 2.09375 10.7862 2.09375 11.7527V11.7527Z"
fill="url(#paint11_linear_18_21855)"
/>
<path
d="M2.09375 11.7527C2.09375 12.0151 2.22895 12.2591 2.45151 12.3982L15.7799 20.7294C15.9097 20.8105 16.0746 20.8104 16.2043 20.7291L29.5771 12.3474C29.7819 12.219 29.9062 11.9944 29.9062 11.7527V11.7527C29.9062 10.7862 29.1227 10.0027 28.1562 10.0027H3.84375C2.87726 10.0027 2.09375 10.7862 2.09375 11.7527V11.7527Z"
fill="url(#paint12_linear_18_21855)"
/>
<path
d="M2.09375 11.7527C2.09375 12.0151 2.22895 12.2591 2.45151 12.3982L15.7799 20.7294C15.9097 20.8105 16.0746 20.8104 16.2043 20.7291L29.5771 12.3474C29.7819 12.219 29.9062 11.9944 29.9062 11.7527V11.7527C29.9062 10.7862 29.1227 10.0027 28.1562 10.0027H3.84375C2.87726 10.0027 2.09375 10.7862 2.09375 11.7527V11.7527Z"
fill="url(#paint13_linear_18_21855)"
/>
<path
d="M2.09375 11.7527C2.09375 12.0151 2.22895 12.2591 2.45151 12.3982L15.7799 20.7294C15.9097 20.8105 16.0746 20.8104 16.2043 20.7291L29.5771 12.3474C29.7819 12.219 29.9062 11.9944 29.9062 11.7527V11.7527C29.9062 10.7862 29.1227 10.0027 28.1562 10.0027H3.84375C2.87726 10.0027 2.09375 10.7862 2.09375 11.7527V11.7527Z"
fill="url(#paint14_radial_18_21855)"
/>
</g>
<g filter="url(#filter2_ii_18_21855)">
<path
d="M13.8656 3.00244C13.5066 3.00244 13.2156 3.29346 13.2156 3.65244V10.9433H11.9703C11.3236 10.9433 10.9801 11.707 11.4091 12.1909L15.445 16.7419C15.7437 17.0788 16.2698 17.0784 16.568 16.7411L20.5916 12.19C21.0196 11.7059 20.6759 10.9433 20.0297 10.9433H18.7464V3.65244C18.7464 3.29346 18.4554 3.00244 18.0964 3.00244H13.8656Z"
fill="url(#paint15_linear_18_21855)"
/>
</g>
<defs>
<filter
id="filter0_i_18_21855"
x={2.09375}
y={18.4027}
width={27.8125}
height={11.5375}
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.75} />
<feGaussianBlur stdDeviation={0.75} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.819608 0 0 0 0 0.654902 0 0 0 0 0.933333 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_21855"
/>
</filter>
<filter
id="filter1_ii_18_21855"
x={2.09375}
y={9.85269}
width={27.8125}
height={11.1875}
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.15} />
<feGaussianBlur stdDeviation={0.225} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.827451 0 0 0 0 0.686275 0 0 0 0 0.913725 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_21855"
/>
<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.25} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.870588 0 0 0 0 0.858824 0 0 0 0 0.854902 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18_21855"
result="effect2_innerShadow_18_21855"
/>
</filter>
<filter
id="filter2_ii_18_21855"
x={11.0188}
y={2.80244}
width={9.96235}
height={14.3919}
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 dx={-0.2} dy={0.2} />
<feGaussianBlur stdDeviation={0.2} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.898039 0 0 0 0 0.333333 0 0 0 0 0.54902 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_21855"
/>
<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 dx={0.2} dy={-0.2} />
<feGaussianBlur stdDeviation={0.2} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.815686 0 0 0 0 0.105882 0 0 0 0 0.341176 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18_21855"
result="effect2_innerShadow_18_21855"
/>
</filter>
<linearGradient
id="paint0_linear_18_21855"
x1={4.09375}
y1={21.1277}
x2={29.9063}
y2={20.9402}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#DFD0E6" />
<stop offset={1} stopColor="#EEE5F8" />
</linearGradient>
<linearGradient
id="paint1_linear_18_21855"
x1={2.09375}
y1={21.0664}
x2={5.13196}
y2={21.0664}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#D6BABD" />
<stop offset={1} stopColor="#DCC9DD" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint2_linear_18_21855"
x1={10.8374}
y1={22.9446}
x2={10.0755}
y2={21.7575}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.113759} stopColor="#DAC3DF" />
<stop offset={1} stopColor="#DAC3DF" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint3_radial_18_21855"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(12.1236 17.3521) rotate(123.69) scale(2.72523 19.1395)"
>
<stop offset={0.342267} stopColor="#C8A6D7" />
<stop offset={1} stopColor="#D1BBDD" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint4_linear_18_21855"
x1={21.0937}
y1={23.2527}
x2={21.9245}
y2={21.7575}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.113759} stopColor="#F6EFFE" />
<stop offset={1} stopColor="#F3EAFD" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint5_linear_18_21855"
x1={20.1563}
y1={17.9089}
x2={21.2187}
y2={19.3464}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E3CDF7" />
<stop offset={1} stopColor="#E9D9F8" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint6_linear_18_21855"
x1={30.0937}
y1={23.5339}
x2={26.375}
y2={23.5339}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#F7F3FB" />
<stop offset={1} stopColor="#F0E9F8" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint7_linear_18_21855"
x1={30.0938}
y1={23.5339}
x2={28.8684}
y2={23.5339}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.199295} stopColor="#EBE9ED" />
<stop offset={1} stopColor="#EBE9ED" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint8_linear_18_21855"
x1={16}
y1={31.6902}
x2={16}
y2={20.8777}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#DDC5F1" />
<stop offset={1} stopColor="#E6DAF1" />
</linearGradient>
<linearGradient
id="paint9_linear_18_21855"
x1={7.48609}
y1={24.0778}
x2={7.94242}
y2={24.7623}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.0734082} stopColor="#DDC2C8" />
<stop offset={1} stopColor="#DFCDDA" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint10_linear_18_21855"
x1={22.5808}
y1={23.13}
x2={22.294}
y2={23.5774}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.139796} stopColor="#F8F3FD" />
<stop offset={1} stopColor="#F1EAF9" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint11_linear_18_21855"
x1={16}
y1={10.0027}
x2={16}
y2={20.7902}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E9E4E9" />
<stop offset={1} stopColor="#E7DCF0" />
</linearGradient>
<linearGradient
id="paint12_linear_18_21855"
x1={9.8097}
y1={16.8494}
x2={13.4243}
y2={10.3643}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E1D5E7" />
<stop offset={1} stopColor="#E1D5E7" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint13_linear_18_21855"
x1={2.09375}
y1={11.6401}
x2={5.02564}
y2={11.6401}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E1C1BC" />
<stop offset={1} stopColor="#E1C1BC" stopOpacity={0} />
<stop offset={1} stopColor="#E9D1CD" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint14_radial_18_21855"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(27.4575 14.0853) rotate(-138.233) scale(6.12906 27.1579)"
>
<stop stopColor="#FBF9FE" />
<stop offset={1} stopColor="#F0ECF1" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint15_linear_18_21855"
x1={13.4107}
y1={9.20947}
x2={18.6121}
y2={9.20947}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E72744" />
<stop offset={1} stopColor="#D02E7F" />
</linearGradient>
</defs>
</svg>
);
module.exports = EnvelopeWithArrowIcon;