UNPKG

@jstnmthw/react-fluentui-emoji

Version:

Fluent Emoji SVG icons for UI react development.

205 lines (204 loc) 7.02 kB
const React = require("react"); const FearfulFaceIcon = ({ 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 clipPath="url(#clip0_31_1629)"> <path d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z" fill="url(#paint0_radial_31_1629)" /> <path d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z" fill="url(#paint1_radial_31_1629)" /> <path d="M15.9989 29.9978C25.3333 29.9978 29.9978 23.7303 29.9978 15.9989C29.9978 8.26751 25.3333 2 15.9989 2C6.66443 2 2 8.26751 2 15.9989C2 23.7303 6.66443 29.9978 15.9989 29.9978Z" fill="url(#paint2_radial_31_1629)" fillOpacity={0.6} /> <circle cx={9} cy={15} r={5} fill="url(#paint3_radial_31_1629)" /> <circle cx={19.5} cy={15.5} r={4.5} fill="url(#paint4_radial_31_1629)" /> <path d="M10.5 18C12.9853 18 15 15.9853 15 13.5C15 11.0147 12.9853 9 10.5 9C8.01472 9 6 11.0147 6 13.5C6 15.9853 8.01472 18 10.5 18Z" fill="white" /> <path d="M21.5 18C23.9853 18 26 15.9853 26 13.5C26 11.0147 23.9853 9 21.5 9C19.0147 9 17 11.0147 17 13.5C17 15.9853 19.0147 18 21.5 18Z" fill="white" /> <path d="M12 16C13.1046 16 14 15.1046 14 14C14 12.8954 13.1046 12 12 12C10.8954 12 10 12.8954 10 14C10 15.1046 10.8954 16 12 16Z" fill="url(#paint5_linear_31_1629)" /> <path d="M20 16C21.1046 16 22 15.1046 22 14C22 12.8954 21.1046 12 20 12C18.8954 12 18 12.8954 18 14C18 15.1046 18.8954 16 20 16Z" fill="url(#paint6_linear_31_1629)" /> <path d="M10.5 5.5C10.5 5.5 10 8.5 6.5 8.5" stroke="url(#paint7_linear_31_1629)" strokeWidth={1.25} strokeLinecap="round" strokeLinejoin="round" /> <path d="M10.5 5.5C10.5 5.5 10 8.5 6.5 8.5" stroke="url(#paint8_radial_31_1629)" strokeWidth={1.25} strokeLinecap="round" strokeLinejoin="round" /> <path d="M21.5 5.5C21.5 5.5 22 8.5 25.5 8.5" stroke="url(#paint9_radial_31_1629)" strokeWidth={1.25} strokeLinecap="round" strokeLinejoin="round" /> <path d="M22.7179 24.0264C23.0288 25.0863 22.1033 26 20.9987 26C17.0451 26 14.6325 26 11.0008 26C9.8962 26 8.9712 25.0863 9.28208 24.0264C10.1341 21.1214 12.8193 19 16 19C19.1807 19 21.8659 21.1214 22.7179 24.0264Z" fill="url(#paint10_radial_31_1629)" /> </g> <defs> <radialGradient id="paint0_radial_31_1629" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(25.5 9) rotate(132.839) scale(37.5033)" > <stop stopColor="#FFF478" /> <stop offset={0.474827} stopColor="#FFB02E" /> <stop offset={1} stopColor="#F70A8D" /> </radialGradient> <radialGradient id="paint1_radial_31_1629" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(16 49) rotate(-90) scale(51 64.9968)" > <stop offset={0.670495} stopColor="#BFB2DD" stopOpacity={0} /> <stop offset={0.747649} stopColor="#A4AEEB" /> <stop offset={0.811631} stopColor="#379EFF" /> <stop offset={0.964059} stopColor="#1345B7" /> </radialGradient> <radialGradient id="paint2_radial_31_1629" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(18 14) rotate(135) scale(41.0122)" > <stop offset={0.314853} stopOpacity={0} /> <stop offset={1} /> </radialGradient> <radialGradient id="paint3_radial_31_1629" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(12.8889 11.1111) rotate(135) scale(9.74236 5.04232)" > <stop stopColor="#392108" /> <stop offset={1} stopColor="#C87928" stopOpacity={0} /> </radialGradient> <radialGradient id="paint4_radial_31_1629" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(23 12) rotate(135) scale(8.13173 4.59049)" > <stop stopColor="#392108" /> <stop offset={1} stopColor="#C87928" stopOpacity={0} /> </radialGradient> <linearGradient id="paint5_linear_31_1629" x1={20.6154} y1={12} x2={19.9265} y2={16.0302} gradientUnits="userSpaceOnUse" > <stop stopColor="#553B3E" /> <stop offset={1} stopColor="#3D2432" /> </linearGradient> <linearGradient id="paint6_linear_31_1629" x1={20.6154} y1={12} x2={19.9265} y2={16.0302} gradientUnits="userSpaceOnUse" > <stop stopColor="#553B3E" /> <stop offset={1} stopColor="#3D2432" /> </linearGradient> <linearGradient id="paint7_linear_31_1629" x1={9.5} y1={5} x2={9.5} y2={6.5} gradientUnits="userSpaceOnUse" > <stop offset={0.0299084} stopColor="#524049" /> <stop offset={1} stopColor="#4A2C42" /> </linearGradient> <radialGradient id="paint8_radial_31_1629" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(7 5) rotate(54.4623) scale(4.30116)" > <stop offset={0.541667} stopColor="#493032" /> <stop offset={0.806723} stopColor="#5E445A" /> <stop offset={0.955326} stopColor="#4A2C42" /> </radialGradient> <radialGradient id="paint9_radial_31_1629" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(25 5) rotate(125.538) scale(4.30116)" > <stop stopColor="#C2B4B5" /> <stop offset={0.887405} stopColor="#462B45" /> <stop offset={1} stopColor="#4A2C42" /> </radialGradient> <radialGradient id="paint10_radial_31_1629" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(16 27) rotate(-90) scale(9 18)" > <stop stopColor="#F70A8D" /> <stop offset={1} stopColor="#89029C" /> </radialGradient> <clipPath id="clip0_31_1629"> <rect width={32} height={32} fill="white" /> </clipPath> </defs> </svg> ); module.exports = FearfulFaceIcon;