@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
532 lines (531 loc) • 18.3 kB
JSX
const React = require("react");
const ComputerDiskIcon = ({ 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_18_19772)">
<rect
x={2.29749}
y={2.10938}
width={27.7812}
height={27.7812}
rx={2.5}
fill="url(#paint0_linear_18_19772)"
/>
</g>
<rect
x={2.29749}
y={2.10938}
width={27.7812}
height={27.7812}
rx={2.5}
fill="url(#paint1_linear_18_19772)"
/>
<rect
x={2.29749}
y={2.10938}
width={27.7812}
height={27.7812}
rx={2.5}
fill="url(#paint2_radial_18_19772)"
/>
<g filter="url(#filter1_f_18_19772)">
<path
d="M29.5436 11.5742V21.5273H21.6014C20.6073 21.5273 19.8014 20.7215 19.8014 19.7273V13.3742C19.8014 12.3801 20.6073 11.5742 21.6014 11.5742H29.5436Z"
fill="#4A2B7F"
/>
</g>
<g filter="url(#filter2_d_18_19772)">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M16.1881 27.6719C22.6343 27.6719 27.86 22.4462 27.86 16C27.86 9.5538 22.6343 4.32812 16.1881 4.32812C9.74191 4.32812 4.51624 9.5538 4.51624 16C4.51624 22.4462 9.74191 27.6719 16.1881 27.6719ZM16.1881 18.7578C17.7112 18.7578 18.9459 17.5231 18.9459 16C18.9459 14.4769 17.7112 13.2422 16.1881 13.2422C14.665 13.2422 13.4303 14.4769 13.4303 16C13.4303 17.5231 14.665 18.7578 16.1881 18.7578Z"
fill="url(#paint3_linear_18_19772)"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M16.1881 27.6719C22.6343 27.6719 27.86 22.4462 27.86 16C27.86 9.5538 22.6343 4.32812 16.1881 4.32812C9.74191 4.32812 4.51624 9.5538 4.51624 16C4.51624 22.4462 9.74191 27.6719 16.1881 27.6719ZM16.1881 18.7578C17.7112 18.7578 18.9459 17.5231 18.9459 16C18.9459 14.4769 17.7112 13.2422 16.1881 13.2422C14.665 13.2422 13.4303 14.4769 13.4303 16C13.4303 17.5231 14.665 18.7578 16.1881 18.7578Z"
fill="url(#paint4_radial_18_19772)"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M16.1881 27.6719C22.6343 27.6719 27.86 22.4462 27.86 16C27.86 9.5538 22.6343 4.32812 16.1881 4.32812C9.74191 4.32812 4.51624 9.5538 4.51624 16C4.51624 22.4462 9.74191 27.6719 16.1881 27.6719ZM16.1881 18.7578C17.7112 18.7578 18.9459 17.5231 18.9459 16C18.9459 14.4769 17.7112 13.2422 16.1881 13.2422C14.665 13.2422 13.4303 14.4769 13.4303 16C13.4303 17.5231 14.665 18.7578 16.1881 18.7578Z"
fill="url(#paint5_radial_18_19772)"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M16.1881 27.6719C22.6343 27.6719 27.86 22.4462 27.86 16C27.86 9.5538 22.6343 4.32812 16.1881 4.32812C9.74191 4.32812 4.51624 9.5538 4.51624 16C4.51624 22.4462 9.74191 27.6719 16.1881 27.6719ZM16.1881 18.7578C17.7112 18.7578 18.9459 17.5231 18.9459 16C18.9459 14.4769 17.7112 13.2422 16.1881 13.2422C14.665 13.2422 13.4303 14.4769 13.4303 16C13.4303 17.5231 14.665 18.7578 16.1881 18.7578Z"
fill="url(#paint6_radial_18_19772)"
/>
</g>
<g filter="url(#filter3_f_18_19772)">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M16.1881 26.9219C22.2201 26.9219 27.11 22.032 27.11 16C27.11 9.96802 22.2201 5.07812 16.1881 5.07812C10.1561 5.07812 5.26624 9.96802 5.26624 16C5.26624 22.032 10.1561 26.9219 16.1881 26.9219ZM19.3287 16C19.3287 17.5231 17.7112 19.25 16.1881 19.25C14.665 19.25 12.86 17.5231 12.86 16C12.86 14.4769 14.665 12.6562 16.1881 12.6562C17.7112 12.6562 19.3287 14.4769 19.3287 16Z"
fill="url(#paint7_linear_18_19772)"
/>
</g>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M16.1881 19.6133C18.1837 19.6133 19.8014 17.9956 19.8014 16C19.8014 14.0044 18.1837 12.3867 16.1881 12.3867C14.1926 12.3867 12.5748 14.0044 12.5748 16C12.5748 17.9956 14.1926 19.6133 16.1881 19.6133ZM18.9459 16C18.9459 17.5231 17.7112 18.7578 16.1881 18.7578C14.665 18.7578 13.4303 17.5231 13.4303 16C13.4303 14.4769 14.665 13.2422 16.1881 13.2422C17.7112 13.2422 18.9459 14.4769 18.9459 16Z"
fill="url(#paint8_radial_18_19772)"
/>
<g filter="url(#filter4_f_18_19772)">
<path
d="M13.4453 13.6478C14.1079 12.8758 15.0909 12.3867 16.1881 12.3867C17.1978 12.3867 18.1108 12.8009 18.7664 13.4686L23.582 8.65303C23.7768 8.45818 23.7781 8.14149 23.5751 7.95506C21.6307 6.16867 19.0367 5.07812 16.1881 5.07812C13.1721 5.07812 10.4417 6.3006 8.46519 8.27707C8.40009 8.34218 8.3358 8.40811 8.27234 8.47484L13.4453 13.6478Z"
fill="url(#paint9_linear_18_19772)"
/>
</g>
<g filter="url(#filter5_f_18_19772)">
<path
d="M18.5403 18.7429C17.9082 19.2855 17.0865 19.6133 16.1881 19.6133C15.2022 19.6133 14.3086 19.2185 13.6567 18.5784L8.84326 23.3918C8.64758 23.5874 8.64731 23.9058 8.85228 24.0917C10.791 25.8504 13.3644 26.9219 16.1881 26.9219C18.8271 26.9219 21.2475 25.986 23.1354 24.4279C23.334 24.264 23.5268 24.0932 23.7133 23.9158L18.5403 18.7429Z"
fill="url(#paint10_linear_18_19772)"
/>
</g>
<g filter="url(#filter6_f_18_19772)">
<path
d="M16.1881 19.6383C18.1975 19.6383 19.8264 18.0094 19.8264 16C19.8264 13.9906 18.1975 12.3617 16.1881 12.3617C14.1787 12.3617 12.5498 13.9906 12.5498 16C12.5498 18.0094 14.1787 19.6383 16.1881 19.6383Z"
stroke="#EFA141"
strokeWidth={0.05}
/>
</g>
<g filter="url(#filter7_f_18_19772)">
<path
d="M28.235 11.5742C28.235 11.5742 27.403 18.625 26.1333 21.5273H21.4421C20.4475 21.5273 19.6412 20.7215 19.6412 19.7273V13.3742C19.6412 12.3801 20.4475 11.5742 21.4421 11.5742H28.235Z"
fill="url(#paint11_linear_18_19772)"
/>
</g>
<g filter="url(#filter8_ii_18_19772)">
<path
d="M30.0787 11.0234V20.9766H22.1366C21.1424 20.9766 20.3365 20.1707 20.3365 19.1766V12.8234C20.3365 11.8293 21.1424 11.0234 22.1366 11.0234H30.0787Z"
fill="url(#paint12_linear_18_19772)"
/>
</g>
<defs>
<filter
id="filter0_ii_18_19772"
x={1.79749}
y={2.10938}
width={28.7812}
height={27.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.5} />
<feGaussianBlur stdDeviation={0.25} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.294118 0 0 0 0 0.239216 0 0 0 0 0.45098 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_19772"
/>
<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.5} />
<feGaussianBlur stdDeviation={0.25} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.439216 0 0 0 0 0.458824 0 0 0 0 0.756863 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18_19772"
result="effect2_innerShadow_18_19772"
/>
</filter>
<filter
id="filter1_f_18_19772"
x={19.3014}
y={11.0742}
width={10.7422}
height={10.9531}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.25}
result="effect1_foregroundBlur_18_19772"
/>
</filter>
<filter
id="filter2_d_18_19772"
x={3.31624}
y={3.77812}
width={24.9438}
height={24.9438}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<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.25} />
<feGaussianBlur stdDeviation={0.4} />
<feComposite in2="hardAlpha" operator="out" />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.278431 0 0 0 0 0.196078 0 0 0 0 0.529412 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="BackgroundImageFix"
result="effect1_dropShadow_18_19772"
/>
<feBlend
mode="normal"
in="SourceGraphic"
in2="effect1_dropShadow_18_19772"
result="shape"
/>
</filter>
<filter
id="filter3_f_18_19772"
x={5.01624}
y={4.82812}
width={22.3438}
height={22.3438}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.125}
result="effect1_foregroundBlur_18_19772"
/>
</filter>
<filter
id="filter4_f_18_19772"
x={8.02234}
y={4.82812}
width={15.9554}
height={9.06958}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.125}
result="effect1_foregroundBlur_18_19772"
/>
</filter>
<filter
id="filter5_f_18_19772"
x={8.44751}
y={18.3284}
width={15.5157}
height={8.84351}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.125}
result="effect1_foregroundBlur_18_19772"
/>
</filter>
<filter
id="filter6_f_18_19772"
x={12.4248}
y={12.2367}
width={7.52666}
height={7.52666}
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_19772"
/>
</filter>
<filter
id="filter7_f_18_19772"
x={18.6412}
y={10.5742}
width={10.5938}
height={11.9531}
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_18_19772"
/>
</filter>
<filter
id="filter8_ii_18_19772"
x={20.3365}
y={10.8234}
width={9.94219}
height={10.3031}
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.2} />
<feGaussianBlur stdDeviation={0.075} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.94902 0 0 0 0 0.913725 0 0 0 0 0.988235 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_19772"
/>
<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.15} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.713726 0 0 0 0 0.564706 0 0 0 0 0.823529 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18_19772"
result="effect2_innerShadow_18_19772"
/>
</filter>
<linearGradient
id="paint0_linear_18_19772"
x1={16.1881}
y1={2.10937}
x2={16.1881}
y2={29.8906}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#6261B8" />
<stop offset={1} stopColor="#5D3687" />
</linearGradient>
<linearGradient
id="paint1_linear_18_19772"
x1={30.4537}
y1={29.8906}
x2={22.0162}
y2={22.5}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#5E328B" />
<stop offset={1} stopColor="#5E328B" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint2_radial_18_19772"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(30.0787 20.8125) rotate(90) scale(8.4375 0.937498)"
>
<stop offset={0.196296} stopColor="#644D98" />
<stop offset={1} stopColor="#644D98" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint3_linear_18_19772"
x1={16.1881}
y1={4.32812}
x2={16.1881}
y2={27.6719}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E9CE53" />
<stop offset={1} stopColor="#FF974E" />
</linearGradient>
<radialGradient
id="paint4_radial_18_19772"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(17.2037 12.125) rotate(113.08) scale(16.8996 14.796)"
>
<stop offset={0.867949} stopColor="#FF684C" stopOpacity={0} />
<stop offset={0.986913} stopColor="#FF684C" />
</radialGradient>
<radialGradient
id="paint5_radial_18_19772"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(21.4219 19.5025) rotate(-148.057) scale(19.0988 14.9191)"
>
<stop offset={0.886595} stopColor="#B99C5E" stopOpacity={0} />
<stop offset={0.978574} stopColor="#B99C5E" />
</radialGradient>
<radialGradient
id="paint6_radial_18_19772"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(13.2201 17.9277) rotate(-37.4054) scale(15.4464)"
>
<stop offset={0.894403} stopColor="#FFE86D" stopOpacity={0} />
<stop offset={0.991068} stopColor="#FFE86D" />
</radialGradient>
<linearGradient
id="paint7_linear_18_19772"
x1={16.1881}
y1={9.6875}
x2={16.1881}
y2={26.9219}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#F4BD5B" />
<stop offset={1} stopColor="#FF9E54" />
</linearGradient>
<radialGradient
id="paint8_radial_18_19772"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(13.3287 16) scale(7.6875)"
>
<stop offset={0.62037} stopColor="#F8AE59" />
<stop offset={1} stopColor="#D48B52" />
</radialGradient>
<linearGradient
id="paint9_linear_18_19772"
x1={23.7277}
y1={8.4375}
x2={12.6413}
y2={8.4375}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FFF25C" />
<stop offset={1} stopColor="#FFF25C" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint10_linear_18_19772"
x1={12.1725}
y1={19.2813}
x2={18.36}
y2={21.1563}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FFD05A" />
<stop offset={1} stopColor="#FFD05A" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint11_linear_18_19772"
x1={24.5145}
y1={11.5742}
x2={24.5145}
y2={21.5273}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#E86F47" stopOpacity={0} />
<stop offset={0.0001} stopColor="#C87C46" />
<stop offset={1} stopColor="#E86F47" />
</linearGradient>
<linearGradient
id="paint12_linear_18_19772"
x1={25.2076}
y1={11.0234}
x2={25.2076}
y2={20.9766}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.204867} stopColor="#F8DFFF" />
<stop offset={0.71978} stopColor="#C5ADDD" />
</linearGradient>
</defs>
</svg>
);
module.exports = ComputerDiskIcon;