UNPKG

@jstnmthw/react-fluentui-emoji

Version:

Fluent Emoji SVG icons for UI react development.

311 lines (310 loc) 10.7 kB
const React = require("react"); const SadButRelievedFaceIcon = ({ 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_1641)"> <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_1641)" /> <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_1641)" /> <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_1641)" /> <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(#paint3_radial_31_1641)" fillOpacity={0.6} /> <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(#paint4_radial_31_1641)" /> <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(#paint5_radial_31_1641)" /> <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(#paint6_radial_31_1641)" /> <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(#paint7_radial_31_1641)" /> <circle cx={9.01705} cy={16.4205} r={4.6733} fill="url(#paint8_radial_31_1641)" /> <circle cx={19.2443} cy={16.9432} r={4.24431} fill="url(#paint9_radial_31_1641)" /> <path d="M10.4191 19.2244C12.742 19.2244 14.6251 17.3414 14.6251 15.0185C14.6251 12.6956 12.742 10.8125 10.4191 10.8125C8.09621 10.8125 6.21313 12.6956 6.21313 15.0185C6.21313 17.3414 8.09621 19.2244 10.4191 19.2244Z" fill="white" /> <path d="M21.5683 19.3011C23.9123 19.3011 25.8126 17.4009 25.8126 15.0568C25.8126 12.7127 23.9123 10.8125 21.5683 10.8125C19.2242 10.8125 17.324 12.7127 17.324 15.0568C17.324 17.4009 19.2242 19.3011 21.5683 19.3011Z" fill="white" /> <path d="M11 18C12.6569 18 14 16.6569 14 15C14 13.3431 12.6569 12 11 12C9.34315 12 8 13.3431 8 15C8 16.6569 9.34315 18 11 18Z" fill="url(#paint10_linear_31_1641)" /> <path d="M21 18C22.6569 18 24 16.6569 24 15C24 13.3431 22.6569 12 21 12C19.3431 12 18 13.3431 18 15C18 16.6569 19.3431 18 21 18Z" fill="url(#paint11_linear_31_1641)" /> <path d="M10.5 6.5C10.5 6.5 10 9.5 6.5 9.5" stroke="url(#paint12_linear_31_1641)" strokeWidth={1.25} strokeLinecap="round" strokeLinejoin="round" /> <path d="M10.5 6.5C10.5 6.5 10 9.5 6.5 9.5" stroke="url(#paint13_radial_31_1641)" strokeWidth={1.25} strokeLinecap="round" strokeLinejoin="round" /> <path d="M21.5 6.5C21.5 6.5 22 9.5 25.5 9.5" stroke="url(#paint14_radial_31_1641)" strokeWidth={1.25} strokeLinecap="round" strokeLinejoin="round" /> <path d="M13 23C13 23 14 22 16 22C18 22 19 23 19 23" stroke="url(#paint15_linear_31_1641)" strokeWidth={2} strokeLinecap="round" /> <rect x={1} y={17} width={5} height={9} rx={2.5} fill="url(#paint16_radial_31_1641)" /> </g> <defs> <radialGradient id="paint0_radial_31_1641" 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_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(25.5 9) rotate(131.878) scale(38.9487)" > <stop stopColor="#FFF478" /> <stop offset={0.474827} stopColor="#FFB02E" /> <stop offset={1} stopColor="#F70A8D" /> </radialGradient> <radialGradient id="paint2_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(16 12.5) rotate(101.31) scale(17.8466 22.8581)" > <stop offset={0.787821} stopColor="#F59639" stopOpacity={0} /> <stop offset={0.972509} stopColor="#FF7DCE" /> </radialGradient> <radialGradient id="paint3_radial_31_1641" 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="paint4_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(16 17) rotate(77.692) scale(28.1469)" > <stop offset={0.507903} stopColor="#7D6133" stopOpacity={0} /> <stop offset={1} stopColor="#715B32" /> </radialGradient> <radialGradient id="paint5_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(16.5 16.5) rotate(55.7131) scale(13.3135 9.65032)" > <stop stopColor="#FFB849" /> <stop offset={1} stopColor="#FFB847" stopOpacity={0} /> </radialGradient> <radialGradient id="paint6_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(20.5 18) rotate(9.86581) scale(11.6726)" > <stop stopColor="#FFA64B" /> <stop offset={0.900412} stopColor="#FFAE46" stopOpacity={0} /> </radialGradient> <radialGradient id="paint7_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(17.5 15) rotate(43.9708) scale(59.0529)" > <stop offset={0.185425} stopOpacity={0} /> <stop offset={1} stopOpacity={0.4} /> </radialGradient> <radialGradient id="paint8_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(12.6518 12.7857) rotate(135) scale(9.10579 4.71285)" > <stop stopColor="#392108" /> <stop offset={1} stopColor="#C87928" stopOpacity={0} /> </radialGradient> <radialGradient id="paint9_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(22.5454 13.642) rotate(135) scale(7.66968 4.32966)" > <stop stopColor="#392108" /> <stop offset={1} stopColor="#C87928" stopOpacity={0} /> </radialGradient> <linearGradient id="paint10_linear_31_1641" x1={16.5} y1={11} x2={15.5} y2={18} gradientUnits="userSpaceOnUse" > <stop stopColor="#553B3E" /> <stop offset={1} stopColor="#3D2432" /> </linearGradient> <linearGradient id="paint11_linear_31_1641" x1={16.5} y1={11} x2={15.5} y2={18} gradientUnits="userSpaceOnUse" > <stop stopColor="#553B3E" /> <stop offset={1} stopColor="#3D2432" /> </linearGradient> <linearGradient id="paint12_linear_31_1641" x1={9.5} y1={6} x2={9.5} y2={7.5} gradientUnits="userSpaceOnUse" > <stop offset={0.0299084} stopColor="#524049" /> <stop offset={1} stopColor="#4A2C42" /> </linearGradient> <radialGradient id="paint13_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(7 6) 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="paint14_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(25 6) rotate(125.538) scale(4.30116)" > <stop stopColor="#C2B4B5" /> <stop offset={0.887405} stopColor="#462B45" /> <stop offset={1} stopColor="#4A2C42" /> </radialGradient> <linearGradient id="paint15_linear_31_1641" x1={16} y1={20} x2={16} y2={22} gradientUnits="userSpaceOnUse" > <stop stopColor="#4F3C43" /> <stop offset={1} stopColor="#512756" /> </linearGradient> <radialGradient id="paint16_radial_31_1641" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(5.16667 17.4091) rotate(104.88) scale(9.73555 3.6969)" > <stop stopColor="#5C98FF" /> <stop offset={0.805982} stopColor="#3D5BF1" /> <stop offset={0.962238} stopColor="#6065CA" /> </radialGradient> <clipPath id="clip0_31_1641"> <rect width={32} height={32} fill="white" /> </clipPath> </defs> </svg> ); module.exports = SadButRelievedFaceIcon;