@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
277 lines (276 loc) • 8.87 kB
JSX
const React = require("react");
const UpDownArrowIcon = ({ 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 filter="url(#filter0_ii_18590_806)">
<rect
x={2.0658}
y={2.0625}
width={27.875}
height={27.875}
rx={3.6}
fill="url(#paint0_linear_18590_806)"
/>
<rect
x={2.0658}
y={2.0625}
width={27.875}
height={27.875}
rx={3.6}
fill="url(#paint1_radial_18590_806)"
/>
</g>
<g filter="url(#filter1_f_18590_806)">
<path
d="M28.2533 4.5625V27.4375"
stroke="url(#paint2_linear_18590_806)"
strokeWidth={1.5}
strokeLinecap="round"
/>
</g>
<g filter="url(#filter2_f_18590_806)">
<path
d="M5.52966 3.875H27.3109"
stroke="url(#paint3_linear_18590_806)"
strokeWidth={1.5}
strokeLinecap="round"
/>
</g>
<g filter="url(#filter3_f_18590_806)">
<path
d="M15.3064 6.23133C15.6935 5.85876 16.3059 5.85876 16.6931 6.23133L22.0059 11.3435C22.6545 11.9677 22.2127 13.0641 21.3125 13.0641H18.2497C18.1117 13.0641 17.9997 13.1761 17.9997 13.3141V18.8141C17.9997 18.9522 18.1117 19.0641 18.2497 19.0641L21.3125 19.0641C22.2127 19.0641 22.6545 20.1605 22.0059 20.7847L16.6931 25.8969C16.3059 26.2695 15.6935 26.2695 15.3064 25.8969L9.99357 20.7847C9.3449 20.1605 9.78674 19.0641 10.6869 19.0641H13.7497C13.8878 19.0641 13.9997 18.9522 13.9997 18.8141V13.3141C13.9997 13.1761 13.8878 13.0641 13.7497 13.0641H10.6869C9.78674 13.0641 9.3449 11.9677 9.99357 11.3436L15.3064 6.23133Z"
fill="#579FFF"
/>
</g>
<g filter="url(#filter4_ii_18590_806)">
<path
d="M15.3064 6.23133C15.6935 5.85876 16.3059 5.85876 16.6931 6.23133L22.0059 11.3435C22.6545 11.9677 22.2127 13.0641 21.3125 13.0641H18.2497C18.1117 13.0641 17.9997 13.1761 17.9997 13.3141V18.8141C17.9997 18.9522 18.1117 19.0641 18.2497 19.0641L21.3125 19.0641C22.2127 19.0641 22.6545 20.1605 22.0059 20.7847L16.6931 25.8969C16.3059 26.2695 15.6935 26.2695 15.3064 25.8969L9.99357 20.7847C9.3449 20.1605 9.78674 19.0641 10.6869 19.0641H13.7497C13.8878 19.0641 13.9997 18.9522 13.9997 18.8141V13.3141C13.9997 13.1761 13.8878 13.0641 13.7497 13.0641H10.6869C9.78674 13.0641 9.3449 11.9677 9.99357 11.3436L15.3064 6.23133Z"
fill="#FCF2FF"
/>
</g>
<defs>
<filter
id="filter0_ii_18590_806"
x={2.0658}
y={1.0625}
width={28.875}
height={28.875}
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={1} dy={-1} />
<feGaussianBlur stdDeviation={1.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.188235 0 0 0 0 0.470588 0 0 0 0 0.843137 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18590_806"
/>
<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={-1} />
<feGaussianBlur stdDeviation={1.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.27451 0 0 0 0 0.34902 0 0 0 0 0.8 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18590_806"
result="effect2_innerShadow_18590_806"
/>
</filter>
<filter
id="filter1_f_18590_806"
x={25.5033}
y={1.8125}
width={5.5}
height={28.375}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={1}
result="effect1_foregroundBlur_18590_806"
/>
</filter>
<filter
id="filter2_f_18590_806"
x={2.77966}
y={1.125}
width={27.2812}
height={5.5}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={1}
result="effect1_foregroundBlur_18590_806"
/>
</filter>
<filter
id="filter3_f_18590_806"
x={8.68494}
y={4.9519}
width={14.6295}
height={22.2244}
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_18590_806"
/>
</filter>
<filter
id="filter4_ii_18590_806"
x={9.08494}
y={5.5519}
width={13.6295}
height={21.2244}
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.6} dy={0.6} />
<feGaussianBlur stdDeviation={0.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.866667 0 0 0 0 0.819608 0 0 0 0 0.941176 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18590_806"
/>
<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.4} dy={-0.4} />
<feGaussianBlur stdDeviation={0.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 1 0 0 0 0 0.988235 0 0 0 0 1 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18590_806"
result="effect2_innerShadow_18590_806"
/>
</filter>
<linearGradient
id="paint0_linear_18590_806"
x1={16.0033}
y1={5.63701}
x2={16.0033}
y2={38.8897}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#5CB7FF" />
<stop offset={1} stopColor="#4878DD" />
</linearGradient>
<radialGradient
id="paint1_radial_18590_806"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(27.722 4.15625) rotate(136.771) scale(2.14444 2.50466)"
>
<stop stopColor="#7BD7FF" />
<stop offset={1} stopColor="#7BD7FF" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint2_linear_18590_806"
x1={28.7533}
y1={4.5625}
x2={28.7533}
y2={27.4375}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#7FD9FF" />
<stop offset={1} stopColor="#639DF4" />
</linearGradient>
<linearGradient
id="paint3_linear_18590_806"
x1={28.4672}
y1={4.12502}
x2={2.93591}
y2={4.12502}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#7DD8FF" />
<stop offset={1} stopColor="#5DB6FF" />
</linearGradient>
</defs>
</svg>
);
module.exports = UpDownArrowIcon;