UNPKG

@jstnmthw/react-fluentui-emoji

Version:

Fluent Emoji SVG icons for UI react development.

593 lines (592 loc) 21.5 kB
const React = require("react"); const SelfieIcon = ({ 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} <rect x={16.9391} y={2.03125} width={6.84375} height={9.9375} rx={0.9} fill="url(#paint0_linear_20020_5804)" /> <rect x={16.9391} y={2.03125} width={6.84375} height={9.9375} rx={0.9} fill="url(#paint1_linear_20020_5804)" /> <path d="M16.9391 11V3.03125H22.9509V11H16.9391Z" fill="url(#paint2_radial_20020_5804)" /> <path d="M16.9391 11V3.03125H22.9509V11H16.9391Z" fill="url(#paint3_linear_20020_5804)" /> <path d="M16.9391 11V3.03125H22.9509V11H16.9391Z" fill="url(#paint4_linear_20020_5804)" /> <path d="M16.9391 11V3.03125H22.9509V11H16.9391Z" fill="url(#paint5_radial_20020_5804)" /> <g filter="url(#filter0_f_20020_5804)"> <path d="M21.328 5.93068C21.328 5.40373 21.7551 4.97656 22.2821 4.97656H23.1581C23.6851 4.97656 24.1122 5.40373 24.1122 5.93068C24.1122 6.45762 23.6851 6.88479 23.1581 6.88479C23.6848 6.88505 24.1115 7.31212 24.1115 7.8389C24.1115 8.25898 23.84 8.61565 23.4629 8.74304C23.8404 8.8702 24.1123 9.22708 24.1123 9.64745C24.1123 10.1744 23.6851 10.6016 23.1582 10.6016H22.2821C21.7552 10.6016 21.328 10.1744 21.328 9.64745C21.328 9.24866 21.5727 8.90702 21.9201 8.76443C21.5056 8.66053 21.1987 8.28556 21.1987 7.8389C21.1987 7.31196 21.6259 6.88479 22.1528 6.88479H22.2816C21.7549 6.88453 21.328 6.45746 21.328 5.93068Z" fill="url(#paint6_linear_20020_5804)" /> </g> <path d="M16.6199 7.29688C15.8901 7.29688 15.2985 7.88625 15.2985 8.61328C15.2985 8.61984 15.2985 8.62639 15.2986 8.63292L15.2985 11.3172C15.2985 12.2191 15.8195 12.9997 16.5781 13.3767C16.8163 13.495 16.9801 13.7455 16.9276 14.0054L16.6316 15.4688H21.9957L22.3712 14.0471C22.4311 13.8205 22.5938 13.6348 22.8111 13.5451L23.5139 13.3013C23.9556 13.1692 24.3663 12.6818 24.5129 12.1166L24.5798 11.8281L23.6317 11.8816C23.5001 11.8761 23.3701 11.9023 23.2403 11.9284C23.1913 11.9383 23.1417 11.9483 23.0927 11.9564C23.044 11.9645 22.994 11.9688 22.943 11.9688H17.8801C17.3812 11.9688 16.9767 11.5658 16.9767 11.0687V10.1797C16.9767 10.0416 17.0886 9.92969 17.2267 9.92969H18.0707C18.8005 9.92969 19.3921 9.34031 19.3921 8.61328C19.3921 7.88625 18.8005 7.29688 18.0707 7.29688H16.6199Z" fill="#F6C32F" /> <path d="M16.6199 7.29688C15.8901 7.29688 15.2985 7.88625 15.2985 8.61328C15.2985 8.61984 15.2985 8.62639 15.2986 8.63292L15.2985 11.3172C15.2985 12.2191 15.8195 12.9997 16.5781 13.3767C16.8163 13.495 16.9801 13.7455 16.9276 14.0054L16.6316 15.4688H21.9957L22.3712 14.0471C22.4311 13.8205 22.5938 13.6348 22.8111 13.5451L23.5139 13.3013C23.9556 13.1692 24.3663 12.6818 24.5129 12.1166L24.5798 11.8281L23.6317 11.8816C23.5001 11.8761 23.3701 11.9023 23.2403 11.9284C23.1913 11.9383 23.1417 11.9483 23.0927 11.9564C23.044 11.9645 22.994 11.9688 22.943 11.9688H17.8801C17.3812 11.9688 16.9767 11.5658 16.9767 11.0687V10.1797C16.9767 10.0416 17.0886 9.92969 17.2267 9.92969H18.0707C18.8005 9.92969 19.3921 9.34031 19.3921 8.61328C19.3921 7.88625 18.8005 7.29688 18.0707 7.29688H16.6199Z" fill="url(#paint7_radial_20020_5804)" /> <path d="M16.6199 7.29688C15.8901 7.29688 15.2985 7.88625 15.2985 8.61328C15.2985 8.61984 15.2985 8.62639 15.2986 8.63292L15.2985 11.3172C15.2985 12.2191 15.8195 12.9997 16.5781 13.3767C16.8163 13.495 16.9801 13.7455 16.9276 14.0054L16.6316 15.4688H21.9957L22.3712 14.0471C22.4311 13.8205 22.5938 13.6348 22.8111 13.5451L23.5139 13.3013C23.9556 13.1692 24.3663 12.6818 24.5129 12.1166L24.5798 11.8281L23.6317 11.8816C23.5001 11.8761 23.3701 11.9023 23.2403 11.9284C23.1913 11.9383 23.1417 11.9483 23.0927 11.9564C23.044 11.9645 22.994 11.9688 22.943 11.9688H17.8801C17.3812 11.9688 16.9767 11.5658 16.9767 11.0687V10.1797C16.9767 10.0416 17.0886 9.92969 17.2267 9.92969H18.0707C18.8005 9.92969 19.3921 9.34031 19.3921 8.61328C19.3921 7.88625 18.8005 7.29688 18.0707 7.29688H16.6199Z" fill="url(#paint8_radial_20020_5804)" /> <path d="M16.6199 7.29688C15.8901 7.29688 15.2985 7.88625 15.2985 8.61328C15.2985 8.61984 15.2985 8.62639 15.2986 8.63292L15.2985 11.3172C15.2985 12.2191 15.8195 12.9997 16.5781 13.3767C16.8163 13.495 16.9801 13.7455 16.9276 14.0054L16.6316 15.4688H21.9957L22.3712 14.0471C22.4311 13.8205 22.5938 13.6348 22.8111 13.5451L23.5139 13.3013C23.9556 13.1692 24.3663 12.6818 24.5129 12.1166L24.5798 11.8281L23.6317 11.8816C23.5001 11.8761 23.3701 11.9023 23.2403 11.9284C23.1913 11.9383 23.1417 11.9483 23.0927 11.9564C23.044 11.9645 22.994 11.9688 22.943 11.9688H17.8801C17.3812 11.9688 16.9767 11.5658 16.9767 11.0687V10.1797C16.9767 10.0416 17.0886 9.92969 17.2267 9.92969H18.0707C18.8005 9.92969 19.3921 9.34031 19.3921 8.61328C19.3921 7.88625 18.8005 7.29688 18.0707 7.29688H16.6199Z" fill="url(#paint9_radial_20020_5804)" /> <path d="M16.6199 7.29688C15.8901 7.29688 15.2985 7.88625 15.2985 8.61328C15.2985 8.61984 15.2985 8.62639 15.2986 8.63292L15.2985 11.3172C15.2985 12.2191 15.8195 12.9997 16.5781 13.3767C16.8163 13.495 16.9801 13.7455 16.9276 14.0054L16.6316 15.4688H21.9957L22.3712 14.0471C22.4311 13.8205 22.5938 13.6348 22.8111 13.5451L23.5139 13.3013C23.9556 13.1692 24.3663 12.6818 24.5129 12.1166L24.5798 11.8281L23.6317 11.8816C23.5001 11.8761 23.3701 11.9023 23.2403 11.9284C23.1913 11.9383 23.1417 11.9483 23.0927 11.9564C23.044 11.9645 22.994 11.9688 22.943 11.9688H17.8801C17.3812 11.9688 16.9767 11.5658 16.9767 11.0687V10.1797C16.9767 10.0416 17.0886 9.92969 17.2267 9.92969H18.0707C18.8005 9.92969 19.3921 9.34031 19.3921 8.61328C19.3921 7.88625 18.8005 7.29688 18.0707 7.29688H16.6199Z" fill="url(#paint10_radial_20020_5804)" /> <g filter="url(#filter1_i_20020_5804)"> <path d="M16.7784 15.0625C16.2725 15.0625 15.8209 15.3798 15.6494 15.8557L13.6255 21.473C13.5183 21.7705 13.2361 21.9688 12.9199 21.9688H2.59774C2.26637 21.9688 1.99774 22.2374 1.99774 22.5688V29.3063C1.99774 29.6376 2.26637 29.9063 2.59774 29.9063H15.8356C17.5864 29.9063 19.1338 28.7677 19.6546 27.0961L22.9997 16.36C23.2003 15.7162 22.7193 15.0625 22.045 15.0625H16.7784Z" fill="#E83896" /> <path d="M16.7784 15.0625C16.2725 15.0625 15.8209 15.3798 15.6494 15.8557L13.6255 21.473C13.5183 21.7705 13.2361 21.9688 12.9199 21.9688H2.59774C2.26637 21.9688 1.99774 22.2374 1.99774 22.5688V29.3063C1.99774 29.6376 2.26637 29.9063 2.59774 29.9063H15.8356C17.5864 29.9063 19.1338 28.7677 19.6546 27.0961L22.9997 16.36C23.2003 15.7162 22.7193 15.0625 22.045 15.0625H16.7784Z" fill="url(#paint11_radial_20020_5804)" /> <path d="M16.7784 15.0625C16.2725 15.0625 15.8209 15.3798 15.6494 15.8557L13.6255 21.473C13.5183 21.7705 13.2361 21.9688 12.9199 21.9688H2.59774C2.26637 21.9688 1.99774 22.2374 1.99774 22.5688V29.3063C1.99774 29.6376 2.26637 29.9063 2.59774 29.9063H15.8356C17.5864 29.9063 19.1338 28.7677 19.6546 27.0961L22.9997 16.36C23.2003 15.7162 22.7193 15.0625 22.045 15.0625H16.7784Z" fill="url(#paint12_linear_20020_5804)" /> </g> <rect x={21.572} y={10.6016} width={3.02734} height={2.09375} rx={1.04688} fill="url(#paint13_radial_20020_5804)" /> <rect x={21.572} y={10.6016} width={3.02734} height={2.09375} rx={1.04688} fill="url(#paint14_radial_20020_5804)" /> <rect x={21.572} y={10.6016} width={3.02734} height={2.09375} rx={1.04688} fill="url(#paint15_radial_20020_5804)" /> <rect x={21.572} y={10.6016} width={3.02734} height={2.09375} rx={1.04688} fill="url(#paint16_linear_20020_5804)" /> <rect x={21.572} y={10.6016} width={3.02734} height={2.09375} rx={1.04688} fill="url(#paint17_linear_20020_5804)" /> <rect x={21.654} y={4.59375} width={3.55469} height={2.09375} rx={1.04688} fill="url(#paint18_linear_20020_5804)" /> <rect x={21.654} y={4.59375} width={3.55469} height={2.09375} rx={1.04688} fill="url(#paint19_radial_20020_5804)" /> <rect x={21.654} y={4.59375} width={3.55469} height={2.09375} rx={1.04688} fill="url(#paint20_radial_20020_5804)" /> <rect x={21.654} y={8.67188} width={3.55469} height={2.09375} rx={1.04688} fill="url(#paint21_radial_20020_5804)" /> <rect x={21.654} y={8.67188} width={3.55469} height={2.09375} rx={1.04688} fill="url(#paint22_radial_20020_5804)" /> <rect x={21.654} y={8.67188} width={3.55469} height={2.09375} rx={1.04688} fill="url(#paint23_radial_20020_5804)" /> <rect x={21.654} y={8.67188} width={3.55469} height={2.09375} rx={1.04688} fill="url(#paint24_linear_20020_5804)" /> <rect x={21.4899} y={6.6875} width={3.71875} height={2.09375} rx={1.04688} fill="url(#paint25_linear_20020_5804)" /> <rect x={21.4899} y={6.6875} width={3.71875} height={2.09375} rx={1.04688} fill="url(#paint26_radial_20020_5804)" /> <rect x={21.4899} y={6.6875} width={3.71875} height={2.09375} rx={1.04688} fill="url(#paint27_radial_20020_5804)" /> <rect x={21.4899} y={6.6875} width={3.71875} height={2.09375} rx={1.04688} fill="url(#paint28_linear_20020_5804)" /> <defs> <filter id="filter0_f_20020_5804" x={20.6987} y={4.47656} width={3.91357} height={6.625} 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_20020_5804" /> </filter> <filter id="filter1_i_20020_5804" x={1.99774} y={15.0625} width={22.0479} height={15.8438} 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} dy={1} /> <feGaussianBlur stdDeviation={1} /> <feComposite in2="hardAlpha" operator="arithmetic" k2={-1} k3={1} /> <feColorMatrix type="matrix" values="0 0 0 0 0.839216 0 0 0 0 0.215686 0 0 0 0 0.380392 0 0 0 1 0" /> <feBlend mode="normal" in2="shape" result="effect1_innerShadow_20020_5804" /> </filter> <linearGradient id="paint0_linear_20020_5804" x1={20.7237} y1={5.66331} x2={24.074} y2={2.50774} gradientUnits="userSpaceOnUse" > <stop stopColor="#48427D" /> <stop offset={1} stopColor="#5C6193" /> </linearGradient> <linearGradient id="paint1_linear_20020_5804" x1={20.361} y1={12.2314} x2={20.361} y2={11.4502} gradientUnits="userSpaceOnUse" > <stop stopColor="#312D58" /> <stop offset={1} stopColor="#312D58" stopOpacity={0} /> </linearGradient> <radialGradient id="paint2_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(21.3975 4.78694) rotate(101.077) scale(7.55948 6.06771)" > <stop stopColor="#54C4FF" /> <stop offset={1} stopColor="#2E8DE8" /> </radialGradient> <linearGradient id="paint3_linear_20020_5804" x1={23.1696} y1={7.29395} x2={22.4665} y2={7.29395} gradientUnits="userSpaceOnUse" > <stop stopColor="#6CEDFF" /> <stop offset={1} stopColor="#6CEDFF" stopOpacity={0} /> </linearGradient> <linearGradient id="paint4_linear_20020_5804" x1={16.9058} y1={7.01563} x2={17.3344} y2={7.01563} gradientUnits="userSpaceOnUse" > <stop stopColor="#5E98C5" /> <stop offset={1} stopColor="#5E98C5" stopOpacity={0} /> </linearGradient> <radialGradient id="paint5_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(18 9.35156) rotate(21.8838) scale(2.09605 1.58128)" > <stop stopColor="#267BAE" /> <stop offset={1} stopColor="#267BAE" stopOpacity={0} /> </radialGradient> <linearGradient id="paint6_linear_20020_5804" x1={21.942} y1={10.6016} x2={21.942} y2={5.68916} gradientUnits="userSpaceOnUse" > <stop stopColor="#2E74A1" /> <stop offset={1} stopColor="#5192B4" /> </linearGradient> <radialGradient id="paint7_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(23.6387 12.4063) rotate(-180) scale(3.19961 3.32917)" > <stop offset={0.424959} stopColor="#F09B4C" /> <stop offset={1} stopColor="#F09B4C" stopOpacity={0} /> </radialGradient> <radialGradient id="paint8_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(16.2487 11.8813) rotate(-13.0745) scale(2.20367 12.6404)" > <stop stopColor="#F09B4C" /> <stop offset={1} stopColor="#F09B4C" stopOpacity={0} /> </radialGradient> <radialGradient id="paint9_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(18.3622 10.1641) rotate(-90) scale(1.71723 3.30237)" > <stop stopColor="#F09B4C" /> <stop offset={1} stopColor="#F09B4C" stopOpacity={0} /> </radialGradient> <radialGradient id="paint10_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(18.8906 8.34778) rotate(135) scale(0.88735 1.00782)" > <stop stopColor="#FFDC62" /> <stop offset={1} stopColor="#FFDC62" stopOpacity={0} /> </radialGradient> <radialGradient id="paint11_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(23.4821 15.0625) rotate(140.064) scale(3.50502 0.921164)" > <stop stopColor="#FF99B6" /> <stop offset={1} stopColor="#FF99B6" stopOpacity={0} /> </radialGradient> <linearGradient id="paint12_linear_20020_5804" x1={11.0759} y1={30.8125} x2={11.0759} y2={27.1875} gradientUnits="userSpaceOnUse" > <stop stopColor="#DF42C3" /> <stop offset={1} stopColor="#DF42C3" stopOpacity={0} /> </linearGradient> <radialGradient id="paint13_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(24.2634 11.6484) rotate(180) scale(2.29687 1.47398)" > <stop stopColor="#FBBE3E" /> <stop offset={1} stopColor="#EAA504" /> </radialGradient> <radialGradient id="paint14_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(24.1801 11.3594) rotate(145.169) scale(0.656563 0.591642)" > <stop stopColor="#FFD666" /> <stop offset={1} stopColor="#FFD666" stopOpacity={0} /> </radialGradient> <radialGradient id="paint15_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(21.1594 11.6484) scale(0.918183 1.71875)" > <stop stopColor="#DD9D52" /> <stop offset={1} stopColor="#DD9D52" stopOpacity={0} /> </radialGradient> <linearGradient id="paint16_linear_20020_5804" x1={23.0856} y1={10.6016} x2={23.0856} y2={10.8828} gradientUnits="userSpaceOnUse" > <stop stopColor="#D68C02" /> <stop offset={1} stopColor="#D68C02" stopOpacity={0} /> </linearGradient> <linearGradient id="paint17_linear_20020_5804" x1={23.0856} y1={12.2611} x2={23.0856} y2={12.8225} gradientUnits="userSpaceOnUse" > <stop stopColor="#EB8F72" stopOpacity={0} /> <stop offset={1} stopColor="#EB8F72" /> </linearGradient> <linearGradient id="paint18_linear_20020_5804" x1={23.4313} y1={4.59375} x2={23.4313} y2={6.6875} gradientUnits="userSpaceOnUse" > <stop stopColor="#F1C438" /> <stop offset={1} stopColor="#F4AF24" /> </linearGradient> <radialGradient id="paint19_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(24.7165 5.35156) rotate(149.349) scale(0.735579 0.620077)" > <stop stopColor="#FFE064" /> <stop offset={1} stopColor="#FFE064" stopOpacity={0} /> </radialGradient> <radialGradient id="paint20_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(21.1696 5.64062) scale(1.07813 1.71875)" > <stop stopColor="#DD9D52" /> <stop offset={1} stopColor="#DD9D52" stopOpacity={0} /> </radialGradient> <radialGradient id="paint21_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(24.8142 9.71875) rotate(180) scale(2.69698 1.47398)" > <stop stopColor="#FBBE3E" /> <stop offset={1} stopColor="#EAA504" /> </radialGradient> <radialGradient id="paint22_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(24.7165 9.42969) rotate(149.349) scale(0.735579 0.620077)" > <stop stopColor="#FFD666" /> <stop offset={1} stopColor="#FFD666" stopOpacity={0} /> </radialGradient> <radialGradient id="paint23_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(21.1696 9.71875) scale(1.07813 1.71875)" > <stop stopColor="#DD9D52" /> <stop offset={1} stopColor="#DD9D52" stopOpacity={0} /> </radialGradient> <linearGradient id="paint24_linear_20020_5804" x1={23.4313} y1={8.625} x2={23.4313} y2={8.92188} gradientUnits="userSpaceOnUse" > <stop stopColor="#D68C02" /> <stop offset={1} stopColor="#D68C02" stopOpacity={0} /> </linearGradient> <linearGradient id="paint25_linear_20020_5804" x1={23.3493} y1={6.6875} x2={23.3493} y2={8.78125} gradientUnits="userSpaceOnUse" > <stop stopColor="#F9BF3E" /> <stop offset={1} stopColor="#F4AF24" /> </linearGradient> <radialGradient id="paint26_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(24.6938 7.44531) rotate(150.471) scale(0.760851 0.627149)" > <stop stopColor="#FFE064" /> <stop offset={1} stopColor="#FFE064" stopOpacity={0} /> </radialGradient> <radialGradient id="paint27_radial_20020_5804" cx={0} cy={0} r={1} gradientUnits="userSpaceOnUse" gradientTransform="translate(20.9832 7.73437) scale(1.12788 1.71875)" > <stop stopColor="#DD9D52" /> <stop offset={1} stopColor="#DD9D52" stopOpacity={0} /> </radialGradient> <linearGradient id="paint28_linear_20020_5804" x1={23.3493} y1={6.5625} x2={23.3493} y2={6.9375} gradientUnits="userSpaceOnUse" > <stop stopColor="#D68C02" /> <stop offset={1} stopColor="#D68C02" stopOpacity={0} /> </linearGradient> </defs> </svg> ); module.exports = SelfieIcon;