@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
366 lines (365 loc) • 11.8 kB
JSX
const React = require("react");
const LockedIcon = ({ 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_i_18_23511)">
<path
d="M10.9531 14.1406V8.57812C10.9531 5.80807 13.1987 3.5625 15.9688 3.5625C18.7388 3.5625 20.9844 5.80807 20.9844 8.57812V14.1406"
stroke="#C2C2C6"
strokeWidth={2.75}
/>
</g>
<path
d="M10.9531 14.1406V8.57812C10.9531 5.80807 13.1987 3.5625 15.9688 3.5625C18.7388 3.5625 20.9844 5.80807 20.9844 8.57812V14.1406"
stroke="url(#paint0_radial_18_23511)"
strokeWidth={2.75}
/>
<g filter="url(#filter1_f_18_23511)">
<path
d="M11.3438 14.1406V8.38093C11.3438 5.51268 13.6383 3.1875 16.4687 3.1875C19.2992 3.1875 21.5937 5.51268 21.5937 8.38093V14.1406"
stroke="url(#paint1_radial_18_23511)"
/>
<path
d="M11.3438 14.1406V8.38093C11.3438 5.51268 13.6383 3.1875 16.4687 3.1875C19.2992 3.1875 21.5937 5.51268 21.5937 8.38093V14.1406"
stroke="url(#paint2_radial_18_23511)"
/>
</g>
<g filter="url(#filter2_iiii_18_23511)">
<rect
x={5.03125}
y={11.125}
width={21.9375}
height={18.8438}
rx={3}
fill="url(#paint3_linear_18_23511)"
/>
</g>
<rect
x={5.03125}
y={11.125}
width={21.9375}
height={18.8438}
rx={3}
fill="url(#paint4_radial_18_23511)"
/>
<rect
x={5.03125}
y={11.125}
width={21.9375}
height={18.8438}
rx={3}
fill="url(#paint5_linear_18_23511)"
/>
<rect
x={5.03125}
y={11.125}
width={21.9375}
height={18.8438}
rx={3}
fill="url(#paint6_radial_18_23511)"
/>
<g filter="url(#filter3_f_18_23511)">
<path
d="M17.3984 20.4619C18.1176 19.9977 18.5938 19.1892 18.5938 18.2695C18.5938 16.8295 17.4264 15.6621 15.9863 15.6621C14.5463 15.6621 13.3789 16.8295 13.3789 18.2695C13.3789 19.2008 13.8671 20.018 14.6016 20.4793V23.7735C14.6016 24.5458 15.2277 25.1719 16 25.1719C16.7723 25.1719 17.3984 24.5458 17.3984 23.7735V20.4619Z"
stroke="url(#paint7_linear_18_23511)"
strokeWidth={1.75}
/>
<path
d="M17.3984 20.4619C18.1176 19.9977 18.5938 19.1892 18.5938 18.2695C18.5938 16.8295 17.4264 15.6621 15.9863 15.6621C14.5463 15.6621 13.3789 16.8295 13.3789 18.2695C13.3789 19.2008 13.8671 20.018 14.6016 20.4793V23.7735C14.6016 24.5458 15.2277 25.1719 16 25.1719C16.7723 25.1719 17.3984 24.5458 17.3984 23.7735V20.4619Z"
stroke="url(#paint8_linear_18_23511)"
strokeWidth={1.75}
/>
</g>
<path
d="M17.3984 20.4619C18.1176 19.9977 18.5938 19.1892 18.5938 18.2695C18.5938 16.8295 17.4264 15.6621 15.9863 15.6621C14.5463 15.6621 13.3789 16.8295 13.3789 18.2695C13.3789 19.2008 13.8671 20.018 14.6016 20.4793V23.7735C14.6016 24.5458 15.2277 25.1719 16 25.1719C16.7723 25.1719 17.3984 24.5458 17.3984 23.7735V20.4619Z"
fill="url(#paint9_radial_18_23511)"
/>
<defs>
<filter
id="filter0_i_18_23511"
x={9.57812}
y={2.1875}
width={13.7812}
height={11.9531}
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} />
<feGaussianBlur stdDeviation={0.5} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.560784 0 0 0 0 0.556863 0 0 0 0 0.576471 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_23511"
/>
</filter>
<filter
id="filter1_f_18_23511"
x={10.0938}
y={1.9375}
width={12.75}
height={12.9531}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={0.375}
result="effect1_foregroundBlur_18_23511"
/>
</filter>
<filter
id="filter2_iiii_18_23511"
x={4.28125}
y={10.375}
width={23.4375}
height={20.3438}
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.375} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.898039 0 0 0 0 0.364706 0 0 0 0 0.423529 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_23511"
/>
<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} />
<feGaussianBlur stdDeviation={0.375} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 1 0 0 0 0 0.772549 0 0 0 0 0.364706 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18_23511"
result="effect2_innerShadow_18_23511"
/>
<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={0.375} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 1 0 0 0 0 0.843137 0 0 0 0 0.266667 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect2_innerShadow_18_23511"
result="effect3_innerShadow_18_23511"
/>
<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.75} />
<feGaussianBlur stdDeviation={0.375} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.729412 0 0 0 0 0.478431 0 0 0 0 0.207843 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect3_innerShadow_18_23511"
result="effect4_innerShadow_18_23511"
/>
</filter>
<filter
id="filter3_f_18_23511"
x={12.0039}
y={14.2871}
width={7.96484}
height={12.2598}
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_23511"
/>
</filter>
<radialGradient
id="paint0_radial_18_23511"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(15.9687 7.65625) rotate(-90) scale(4.84375 5.28858)"
>
<stop offset={0.530612} stopColor="#AB83C0" />
<stop offset={1} stopColor="#CBBBDC" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint1_radial_18_23511"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(21.8993 4.59375) rotate(136.74) scale(5.24397 7.20331)"
>
<stop offset={0.215771} stopColor="#EDECF3" />
<stop offset={1} stopColor="#EDECF3" stopOpacity={0} />
</radialGradient>
<radialGradient
id="paint2_radial_18_23511"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(12.5505 12.6562) rotate(-90) scale(7.125 5.16319)"
>
<stop stopColor="#EDECF3" />
<stop offset={1} stopColor="#EDECF3" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint3_linear_18_23511"
x1={10.1562}
y1={14.1875}
x2={17.0938}
y2={29.9688}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FFC74E" />
<stop offset={1} stopColor="#F7864E" />
</linearGradient>
<radialGradient
id="paint4_radial_18_23511"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(26.4063 29.9687) rotate(-132.274) scale(3.25195 7.57598)"
>
<stop stopColor="#FF8650" />
<stop offset={1} stopColor="#FF8650" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint5_linear_18_23511"
x1={16}
y1={10.8125}
x2={16}
y2={12.3125}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#F3D04E" />
<stop offset={1} stopColor="#F3D04E" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint6_radial_18_23511"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(26.6562 11.125) rotate(126.254) scale(2.32513 5.25171)"
>
<stop stopColor="#FFF760" />
<stop offset={1} stopColor="#FFF760" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint7_linear_18_23511"
x1={19.125}
y1={21.75}
x2={15.25}
y2={21.75}
gradientUnits="userSpaceOnUse"
>
<stop offset={0.330645} stopColor="#D98A40" />
<stop offset={1} stopColor="#D98A40" stopOpacity={0} />
</linearGradient>
<linearGradient
id="paint8_linear_18_23511"
x1={12.875}
y1={20.8125}
x2={15.5938}
y2={20.8125}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#FFCD63" />
<stop offset={1} stopColor="#FFCD63" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint9_radial_18_23511"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(13.3789 18.6875) rotate(34.0609) scale(5.69121 7.82719)"
>
<stop offset={0.21669} stopColor="#564F80" />
<stop offset={1} stopColor="#473154" />
</radialGradient>
</defs>
</svg>
);
module.exports = LockedIcon;