@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
604 lines (603 loc) • 19.8 kB
JSX
const React = require("react");
const LevelSliderIcon = ({ 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_iii_18_18133)">
<path
d="M5.02734 5.14063C5.02734 3.48377 6.37049 2.14062 8.02734 2.14062H23.9336C25.5904 2.14062 26.9336 3.48377 26.9336 5.14062V26.8594C26.9336 28.5162 25.5904 29.8594 23.9336 29.8594H8.02734C6.37049 29.8594 5.02734 28.5162 5.02734 26.8594V5.14063Z"
fill="url(#paint0_linear_18_18133)"
/>
</g>
<g filter="url(#filter1_i_18_18133)">
<path
d="M7.51172 7.49219C7.51172 7.12544 7.80903 6.82812 8.17578 6.82812H10.5664C10.9332 6.82812 11.2305 7.12544 11.2305 7.49219C11.2305 7.85894 10.9332 8.15625 10.5664 8.15625H8.17578C7.80903 8.15625 7.51172 7.85894 7.51172 7.49219Z"
fill="url(#paint1_linear_18_18133)"
/>
</g>
<g filter="url(#filter2_i_18_18133)">
<path
d="M20.6992 7.49219C20.6992 7.12544 20.9965 6.82812 21.3633 6.82812H23.7539C24.1207 6.82812 24.418 7.12544 24.418 7.49219C24.418 7.85894 24.1207 8.15625 23.7539 8.15625H21.3633C20.9965 8.15625 20.6992 7.85894 20.6992 7.49219Z"
fill="url(#paint2_linear_18_18133)"
/>
</g>
<g filter="url(#filter3_i_18_18133)">
<path
d="M7.51172 15.5234C7.51172 15.1567 7.80903 14.8594 8.17578 14.8594H10.5664C10.9332 14.8594 11.2305 15.1567 11.2305 15.5234C11.2305 15.8902 10.9332 16.1875 10.5664 16.1875H8.17578C7.80903 16.1875 7.51172 15.8902 7.51172 15.5234Z"
fill="url(#paint3_linear_18_18133)"
/>
</g>
<g filter="url(#filter4_i_18_18133)">
<path
d="M20.6992 15.5234C20.6992 15.1567 20.9965 14.8594 21.3633 14.8594H23.7539C24.1207 14.8594 24.418 15.1567 24.418 15.5234C24.418 15.8902 24.1207 16.1875 23.7539 16.1875H21.3633C20.9965 16.1875 20.6992 15.8902 20.6992 15.5234Z"
fill="url(#paint4_linear_18_18133)"
/>
</g>
<g filter="url(#filter5_i_18_18133)">
<path
d="M7.51172 24.4766C7.51172 24.1098 7.80903 23.8125 8.17578 23.8125H10.5664C10.9332 23.8125 11.2305 24.1098 11.2305 24.4766C11.2305 24.8433 10.9332 25.1406 10.5664 25.1406H8.17578C7.80903 25.1406 7.51172 24.8433 7.51172 24.4766Z"
fill="url(#paint5_linear_18_18133)"
/>
</g>
<g filter="url(#filter6_i_18_18133)">
<path
d="M20.6992 24.4766C20.6992 24.1098 20.9965 23.8125 21.3633 23.8125H23.7539C24.1207 23.8125 24.418 24.1098 24.418 24.4766C24.418 24.8433 24.1207 25.1406 23.7539 25.1406H21.3633C20.9965 25.1406 20.6992 24.8433 20.6992 24.4766Z"
fill="url(#paint6_linear_18_18133)"
/>
</g>
<g filter="url(#filter7_f_18_18133)">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M19.3789 9.01953V23.043C19.3789 24.9091 17.8661 26.4219 16 26.4219C14.1339 26.4219 12.6211 24.9091 12.6211 23.043V9.01953C12.6211 7.15341 14.1339 5.64062 16 5.64062C17.8661 5.64062 19.3789 7.15341 19.3789 9.01953Z"
fill="url(#paint7_linear_18_18133)"
/>
<path
d="M19.4289 23.043V9.01953C19.4289 7.1258 17.8937 5.59062 16 5.59062C14.1063 5.59062 12.5711 7.1258 12.5711 9.01953V23.043C12.5711 24.9367 14.1063 26.4719 16 26.4719C17.8937 26.4719 19.4289 24.9367 19.4289 23.043Z"
stroke="#E3D8F0"
strokeWidth={0.1}
/>
</g>
<g filter="url(#filter8_ii_18_18133)">
<path
d="M13.6211 9.01953C13.6211 7.7057 14.6862 6.64062 16 6.64062C17.3138 6.64062 18.3789 7.7057 18.3789 9.01953V23.043C18.3789 24.3568 17.3138 25.4219 16 25.4219C14.6862 25.4219 13.6211 24.3568 13.6211 23.043V9.01953Z"
fill="url(#paint8_linear_18_18133)"
/>
</g>
<path
d="M13.6211 12.6406V23.043C13.6211 24.3568 14.6862 25.4219 16 25.4219C17.3138 25.4219 18.3789 24.3568 18.3789 23.043V12.6406H13.6211Z"
fill="url(#paint9_linear_18_18133)"
/>
<g filter="url(#filter9_i_18_18133)">
<path
d="M10.9922 12.0156C10.9922 10.9111 11.8876 10.0156 12.9922 10.0156H19.0078C20.1124 10.0156 21.0078 10.9111 21.0078 12.0156C21.0078 13.1202 20.1124 14.0156 19.0078 14.0156H12.9922C11.8876 14.0156 10.9922 13.1202 10.9922 12.0156Z"
fill="#3399D6"
/>
<path
d="M10.9922 12.0156C10.9922 10.9111 11.8876 10.0156 12.9922 10.0156H19.0078C20.1124 10.0156 21.0078 10.9111 21.0078 12.0156C21.0078 13.1202 20.1124 14.0156 19.0078 14.0156H12.9922C11.8876 14.0156 10.9922 13.1202 10.9922 12.0156Z"
fill="url(#paint10_radial_18_18133)"
/>
</g>
<defs>
<filter
id="filter0_iii_18_18133"
x={4.72734}
y={1.84062}
width={22.6063}
height={28.3188}
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.3} dy={0.3} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.964706 0 0 0 0 0.94902 0 0 0 0 0.988235 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
<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.3} />
<feGaussianBlur stdDeviation={0.375} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.780392 0 0 0 0 0.764706 0 0 0 0 0.8 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18_18133"
result="effect2_innerShadow_18_18133"
/>
<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.3} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.792157 0 0 0 0 0.694118 0 0 0 0 0.894118 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect2_innerShadow_18_18133"
result="effect3_innerShadow_18_18133"
/>
</filter>
<filter
id="filter1_i_18_18133"
x={7.51172}
y={6.82812}
width={3.71875}
height={1.62813}
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.3} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.564706 0 0 0 0 0.541176 0 0 0 0 0.607843 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
</filter>
<filter
id="filter2_i_18_18133"
x={20.6992}
y={6.82812}
width={3.71875}
height={1.62813}
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.3} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.564706 0 0 0 0 0.541176 0 0 0 0 0.607843 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
</filter>
<filter
id="filter3_i_18_18133"
x={7.51172}
y={14.8594}
width={3.71875}
height={1.62813}
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.3} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.564706 0 0 0 0 0.541176 0 0 0 0 0.607843 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
</filter>
<filter
id="filter4_i_18_18133"
x={20.6992}
y={14.8594}
width={3.71875}
height={1.62813}
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.3} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.564706 0 0 0 0 0.541176 0 0 0 0 0.607843 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
</filter>
<filter
id="filter5_i_18_18133"
x={7.51172}
y={23.8125}
width={3.71875}
height={1.62813}
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.3} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.564706 0 0 0 0 0.541176 0 0 0 0 0.607843 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
</filter>
<filter
id="filter6_i_18_18133"
x={20.6992}
y={23.8125}
width={3.71875}
height={1.62813}
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.3} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.564706 0 0 0 0 0.541176 0 0 0 0 0.607843 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
</filter>
<filter
id="filter7_f_18_18133"
x={12.371}
y={5.39065}
width={7.25801}
height={21.2812}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.075}
result="effect1_foregroundBlur_18_18133"
/>
</filter>
<filter
id="filter8_ii_18_18133"
x={13.3711}
y={6.64062}
width={5.10781}
height={18.7812}
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.25} />
<feGaussianBlur stdDeviation={0.4} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.321569 0 0 0 0 0.262745 0 0 0 0 0.501961 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
<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.1} />
<feGaussianBlur stdDeviation={0.2} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.372549 0 0 0 0 0.368627 0 0 0 0 0.588235 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18_18133"
result="effect2_innerShadow_18_18133"
/>
</filter>
<filter
id="filter9_i_18_18133"
x={10.9922}
y={8.81562}
width={10.8156}
height={5.2}
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.8} dy={-1.2} />
<feGaussianBlur stdDeviation={1.125} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.188235 0 0 0 0 0.360784 0 0 0 0 0.698039 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_18133"
/>
</filter>
<linearGradient
id="paint0_linear_18_18133"
x1={24.8711}
y1={3.26562}
x2={11.4336}
y2={29.8594}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E1DAEC" />
<stop offset={1} stopColor="#D7C8E9" />
</linearGradient>
<linearGradient
id="paint1_linear_18_18133"
x1={7.51172}
y1={8.15625}
x2={9.37109}
y2={8.15625}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A39FAA" />
<stop offset={1} stopColor="#96939D" />
</linearGradient>
<linearGradient
id="paint2_linear_18_18133"
x1={20.6992}
y1={8.15625}
x2={22.5586}
y2={8.15625}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A39FAA" />
<stop offset={1} stopColor="#96939D" />
</linearGradient>
<linearGradient
id="paint3_linear_18_18133"
x1={7.51172}
y1={16.1875}
x2={9.37109}
y2={16.1875}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A39FAA" />
<stop offset={1} stopColor="#96939D" />
</linearGradient>
<linearGradient
id="paint4_linear_18_18133"
x1={20.6992}
y1={16.1875}
x2={22.5586}
y2={16.1875}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A39FAA" />
<stop offset={1} stopColor="#96939D" />
</linearGradient>
<linearGradient
id="paint5_linear_18_18133"
x1={7.51172}
y1={25.1406}
x2={9.37109}
y2={25.1406}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A39FAA" />
<stop offset={1} stopColor="#96939D" />
</linearGradient>
<linearGradient
id="paint6_linear_18_18133"
x1={20.6992}
y1={25.1406}
x2={22.5586}
y2={25.1406}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#A39FAA" />
<stop offset={1} stopColor="#96939D" />
</linearGradient>
<linearGradient
id="paint7_linear_18_18133"
x1={16}
y1={5.64062}
x2={16}
y2={26.4219}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.369925} stopColor="#A19EB4" />
<stop offset={1} stopColor="#B3ABBF" />
</linearGradient>
<linearGradient
id="paint8_linear_18_18133"
x1={16}
y1={8.95312}
x2={16}
y2={25.4219}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#56588B" />
<stop offset={1} stopColor="#604A81" />
</linearGradient>
<linearGradient
id="paint9_linear_18_18133"
x1={16.2148}
y1={13.6719}
x2={16.1651}
y2={16.3897}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.0229885} stopColor="#4F467F" />
<stop offset={1} stopColor="#4F467F" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint10_radial_18_18133"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(21.0078 11.2344) rotate(170.259) scale(2.77041 2.41923)"
>
<stop offset={0.197183} stopColor="#5CAFE7" />
<stop offset={1} stopColor="#5CAFE7" stopOpacity={0} />
</radialGradient>
</defs>
</svg>
);
module.exports = LevelSliderIcon;