@jstnmthw/react-fluentui-emoji
Version:
Fluent Emoji SVG icons for UI react development.
284 lines (283 loc) • 10 kB
JSX
const React = require("react");
const TwelveOclockIcon = ({ 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}
<path
d="M28.1842 16C28.1842 22.7464 22.7152 28.2154 15.9688 28.2154C9.22245 28.2154 3.75345 22.7464 3.75345 16C3.75345 9.25367 9.22245 3.78467 15.9688 3.78467C22.7152 3.78467 28.1842 9.25367 28.1842 16Z"
fill="url(#paint0_radial_18_13489)"
/>
<g filter="url(#filter0_f_18_13489)">
<path
d="M14.9976 8.00879C15.5499 8.00879 15.9976 8.4565 15.9976 9.00879V15.2903C16.5903 15.6346 16.9888 16.2763 16.9888 17.0112C16.9888 18.1096 16.0984 19 15 19C13.9016 19 13.0112 18.1096 13.0112 17.0112C13.0112 16.2783 13.4075 15.638 13.9976 15.293V9.00879C13.9976 8.4565 14.4453 8.00879 14.9976 8.00879Z"
fill="url(#paint1_linear_18_13489)"
/>
</g>
<g filter="url(#filter1_i_18_13489)">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M15.9976 7.00879C16.5499 7.00879 16.9976 7.4565 16.9976 8.00879V16.0042C16.9976 16.5565 16.5499 17.0042 15.9976 17.0042C15.4453 17.0042 14.9976 16.5565 14.9976 16.0042V8.00879C14.9976 7.4565 15.4453 7.00879 15.9976 7.00879Z"
fill="#F83F4C"
/>
</g>
<g filter="url(#filter2_ii_18_13489)">
<path
fillRule="evenodd"
clipRule="evenodd"
d="M15.9688 27C22.0439 27 26.9688 22.0751 26.9688 16C26.9688 9.92487 22.0439 5 15.9688 5C9.89368 5 4.96881 9.92487 4.96881 16C4.96881 22.0751 9.89368 27 15.9688 27ZM15.9688 30C23.7008 30 29.9688 23.732 29.9688 16C29.9688 8.26801 23.7008 2 15.9688 2C8.23682 2 1.96881 8.26801 1.96881 16C1.96881 23.732 8.23682 30 15.9688 30Z"
fill="url(#paint2_linear_18_13489)"
/>
</g>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M15.9976 9.03699C16.5499 9.03699 16.9976 9.4847 16.9976 10.037V16.0042C16.9976 16.5564 16.5499 17.0042 15.9976 17.0042C15.4453 17.0042 14.9976 16.5564 14.9976 16.0042V10.037C14.9976 9.4847 15.4453 9.03699 15.9976 9.03699Z"
fill="url(#paint3_linear_18_13489)"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M15.9976 9.03699C16.5499 9.03699 16.9976 9.4847 16.9976 10.037V16.0042C16.9976 16.5564 16.5499 17.0042 15.9976 17.0042C15.4453 17.0042 14.9976 16.5564 14.9976 16.0042V10.037C14.9976 9.4847 15.4453 9.03699 15.9976 9.03699Z"
fill="url(#paint4_linear_18_13489)"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M15.9976 9.03699C16.5499 9.03699 16.9976 9.4847 16.9976 10.037V16.0042C16.9976 16.5564 16.5499 17.0042 15.9976 17.0042C15.4453 17.0042 14.9976 16.5564 14.9976 16.0042V10.037C14.9976 9.4847 15.4453 9.03699 15.9976 9.03699Z"
fill="url(#paint5_radial_18_13489)"
/>
<path
fillRule="evenodd"
clipRule="evenodd"
d="M15.9976 9.03699C16.5499 9.03699 16.9976 9.4847 16.9976 10.037V16.0042C16.9976 16.5564 16.5499 17.0042 15.9976 17.0042C15.4453 17.0042 14.9976 16.5564 14.9976 16.0042V10.037C14.9976 9.4847 15.4453 9.03699 15.9976 9.03699Z"
fill="url(#paint6_linear_18_13489)"
/>
<path
d="M17.9888 16.0112C17.9888 17.1096 17.0984 18 16 18C14.9016 18 14.0112 17.1096 14.0112 16.0112C14.0112 14.9128 14.9016 14.0223 16 14.0223C17.0984 14.0223 17.9888 14.9128 17.9888 16.0112Z"
fill="url(#paint7_radial_18_13489)"
/>
<path
d="M17.9888 16.0112C17.9888 17.1096 17.0984 18 16 18C14.9016 18 14.0112 17.1096 14.0112 16.0112C14.0112 14.9128 14.9016 14.0223 16 14.0223C17.0984 14.0223 17.9888 14.9128 17.9888 16.0112Z"
fill="url(#paint8_radial_18_13489)"
/>
<defs>
<filter
id="filter0_f_18_13489"
x={11.0112}
y={6.00879}
width={7.97766}
height={14.9912}
filterUnits="userSpaceOnUse"
colorInterpolationFilters="sRGB"
>
<feFlood floodOpacity={0} result="BackgroundImageFix" />
<feBlend
mode="normal"
in="SourceGraphic"
in2="BackgroundImageFix"
result="shape"
/>
<feGaussianBlur
stdDeviation={1}
result="effect1_foregroundBlur_18_13489"
/>
</filter>
<filter
id="filter1_i_18_13489"
x={14.9976}
y={7.00879}
width={2.6}
height={9.99536}
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} />
<feGaussianBlur stdDeviation={0.375} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.654902 0 0 0 0 0.188235 0 0 0 0 0.219608 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_13489"
/>
</filter>
<filter
id="filter2_ii_18_13489"
x={1.56881}
y={1.6}
width={28.8}
height={28.8}
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.4} dy={-0.4} />
<feGaussianBlur stdDeviation={0.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.282353 0 0 0 0 0.254902 0 0 0 0 0.313726 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="shape"
result="effect1_innerShadow_18_13489"
/>
<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.3} />
<feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} />
<feColorMatrix
type="matrix"
values="0 0 0 0 0.533333 0 0 0 0 0.533333 0 0 0 0 0.533333 0 0 0 1 0"
/>
<feBlend
mode="normal"
in2="effect1_innerShadow_18_13489"
result="effect2_innerShadow_18_13489"
/>
</filter>
<radialGradient
id="paint0_radial_18_13489"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(10.362 23.415) rotate(-46.2124) scale(22.0719)"
>
<stop offset={0.598155} stopColor="#DDDADF" />
<stop offset={1} stopColor="#BDBABF" />
</radialGradient>
<linearGradient
id="paint1_linear_18_13489"
x1={15}
y1={8.00879}
x2={15}
y2={19}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#C6BBBF" />
<stop offset={1} stopColor="#C3C0C7" />
</linearGradient>
<linearGradient
id="paint2_linear_18_13489"
x1={24.4796}
y1={4.01349}
x2={4.25261}
y2={28.5336}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#6D6B70" />
<stop offset={1} stopColor="#706C74" />
</linearGradient>
<linearGradient
id="paint3_linear_18_13489"
x1={15.9976}
y1={9.03699}
x2={15.9976}
y2={14.8484}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#32183D" />
<stop offset={1} stopColor="#2C3A65" />
</linearGradient>
<linearGradient
id="paint4_linear_18_13489"
x1={14.9976}
y1={12.0672}
x2={15.9976}
y2={12.0672}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#2E2840" />
<stop offset={1} stopColor="#2E2840" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint5_radial_18_13489"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(16.607 9.42938) rotate(90) scale(5.73026 0.815281)"
>
<stop stopColor="#50375F" />
<stop offset={1} stopColor="#50375F" stopOpacity={0} />
</radialGradient>
<linearGradient
id="paint6_linear_18_13489"
x1={15.9976}
y1={9.03699}
x2={15.9976}
y2={9.75465}
gradientUnits="userSpaceOnUse"
>
<stop stopColor="#3E1846" />
<stop offset={1} stopColor="#3E1846" stopOpacity={0} />
</linearGradient>
<radialGradient
id="paint7_radial_18_13489"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(17.0798 15.5527) rotate(134.039) scale(3.40442)"
>
<stop stopColor="#C9C6CC" />
<stop offset={1} stopColor="#928E95" />
</radialGradient>
<radialGradient
id="paint8_radial_18_13489"
cx={0}
cy={0}
r={1}
gradientUnits="userSpaceOnUse"
gradientTransform="translate(16.5626 15.5047) rotate(139.399) scale(2.88111)"
>
<stop offset={0.527069} stopColor="#776F7F" stopOpacity={0} />
<stop offset={1} stopColor="#776F7F" />
</radialGradient>
</defs>
</svg>
);
module.exports = TwelveOclockIcon;