@nexusui/branding
Version:
This package contains branding elements for NexusUI applications, including logos for each unique product line. These icons work the same as basic SVG icons in React.
8 lines (5 loc) • 5.3 kB
JavaScript
import { jsxs, jsx } from 'react/jsx-runtime';
import { memo } from 'react';
const SvgGenerativeDesign = (props) => (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 52 52", ...props, children: [jsxs("g", { clipPath: "url(#generative-design_svg__a)", children: [jsx("path", { fill: "#F95B61", d: "M0 16.25C0 7.275 7.275 0 16.25 0h19.5C44.725 0 52 7.275 52 16.25v19.5C52 44.725 44.725 52 35.75 52h-19.5C7.275 52 0 44.725 0 35.75v-19.5Z" }), jsx("path", { fill: "#0D0D0D", d: "m18.601 8.687-7.069 4.08 7.74 4.47-6.669 3.837a3.57 3.57 0 0 0-1.79 3.097l.009 12.954a3.57 3.57 0 0 0 1.785 3.09l5.288 3.052 7.089-4.073-7.1-4.096v-8.91l8.466-4.901.005 8.21 7.09-4.073V17.26L18.6 8.688Zm.288 15.348v-.029l.01-.004.024.014-.034.02Z" }), jsx("path", { fill: "#0D0D0D", d: "m39.397 30.929-6.663 3.834 7.74 4.47-7.07 4.08-14.842-8.573v-8.164l7.089-4.073.005 8.21 8.467-4.9-.002-8.907-7.14-4.12 7.088-4.073 5.293 3.055a3.57 3.57 0 0 1 1.786 3.081l.04 12.974a3.571 3.571 0 0 1-1.79 3.106Z" }), jsx("path", { fill: "url(#generative-design_svg__b)", d: "M33.444 17.26 18.6 8.686l-7.069 4.08 7.74 4.47-6.669 3.837a3.57 3.57 0 0 0-1.79 3.097l.009 12.954a3.57 3.57 0 0 0 1.785 3.09l5.288 3.052 7.089-4.073-7.1-4.096v-8.91l8.466-4.901m-7.46 2.748v-.029l.01-.004.023.014-.033.02Z", opacity: 0.64 }), jsx("path", { fill: "url(#generative-design_svg__c)", d: "m18.562 34.74 14.842 8.573 7.07-4.08-7.74-4.47 6.663-3.834a3.57 3.57 0 0 0 1.79-3.106l-.04-12.974a3.572 3.572 0 0 0-1.785-3.082l-5.294-3.055-7.088 4.073 7.14 4.12.002 8.908-8.467 4.9-7.094 4.027Z", opacity: 0.4 }), jsx("path", { fill: "url(#generative-design_svg__d)", d: "M18.562 34.74v-8.164l7.089-4.073.005 8.21", opacity: 0.24 }), jsx("path", { fill: "url(#generative-design_svg__e)", d: "m26.35 21.287.005 8.21 7.089-4.073V17.26", opacity: 0.24 }), jsx("path", { fill: "url(#generative-design_svg__f)", d: "M40.727 13.152s-.264-.748-1.365-1.384l-5.294-3.055-7.088 4.072 7.14 4.121", opacity: 0.48 })] }), jsxs("defs", { children: [jsxs("linearGradient", { id: "generative-design_svg__b", x1: 9.677, x2: 31.118, y1: 21.419, y2: 32.82, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.09, stopColor: "#F2585E", stopOpacity: 0.97 }), jsx("stop", { offset: 0.22, stopColor: "#E05258", stopOpacity: 0.89 }), jsx("stop", { offset: 0.37, stopColor: "#C2484D", stopOpacity: 0.77 }), jsx("stop", { offset: 0.55, stopColor: "#983B3E", stopOpacity: 0.59 }), jsx("stop", { offset: 0.74, stopColor: "#62292B", stopOpacity: 0.36 }), jsx("stop", { offset: 0.94, stopColor: "#221414", stopOpacity: 0.09 }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "generative-design_svg__c", x1: 22.986, x2: 44.468, y1: 20.297, y2: 31.719, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.09, stopColor: "#120E0F", stopOpacity: 0.02 }), jsx("stop", { offset: 0.22, stopColor: "#221414", stopOpacity: 0.09 }), jsx("stop", { offset: 0.37, stopColor: "#3D1D1E", stopOpacity: 0.21 }), jsx("stop", { offset: 0.53, stopColor: "#62292B", stopOpacity: 0.36 }), jsx("stop", { offset: 0.7, stopColor: "#92393C", stopOpacity: 0.56 }), jsx("stop", { offset: 0.87, stopColor: "#CB4B50", stopOpacity: 0.81 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "generative-design_svg__d", x1: 18.495, x2: 25.74, y1: 26.702, y2: 30.554, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.05, stopColor: "#ED575C", stopOpacity: 0.94 }), jsx("stop", { offset: 0.53, stopColor: "#8F373B", stopOpacity: 0.46 }), jsx("stop", { offset: 0.85, stopColor: "#532326", stopOpacity: 0.16 }), jsx("stop", { offset: 1, stopColor: "#3C1C1E", stopOpacity: 0.04 })] }), jsxs("linearGradient", { id: "generative-design_svg__e", x1: 26.265, x2: 33.51, y1: 21.446, y2: 25.298, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F2595E", stopOpacity: 0.66 }), jsx("stop", { offset: 0.07, stopColor: "#D34E53", stopOpacity: 0.57 }), jsx("stop", { offset: 0.22, stopColor: "#9A3B3E", stopOpacity: 0.4 }), jsx("stop", { offset: 0.37, stopColor: "#6A2B2D", stopOpacity: 0.26 }), jsx("stop", { offset: 0.52, stopColor: "#451F20", stopOpacity: 0.15 }), jsx("stop", { offset: 0.68, stopColor: "#2A1617", stopOpacity: 0.07 }), jsx("stop", { offset: 0.83, stopColor: "#1B1111", stopOpacity: 0.03 }), jsx("stop", { offset: 1, stopColor: "#161010", stopOpacity: 0.01 })] }), jsxs("linearGradient", { id: "generative-design_svg__f", x1: 28.538, x2: 39.407, y1: 9.855, y2: 15.634, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.09, stopColor: "#EC565C", stopOpacity: 0.96 }), jsx("stop", { offset: 0.27, stopColor: "#CA4B50", stopOpacity: 0.86 }), jsx("stop", { offset: 0.51, stopColor: "#93393C", stopOpacity: 0.7 }), jsx("stop", { offset: 0.8, stopColor: "#482022", stopOpacity: 0.48 }), jsx("stop", { offset: 1, stopColor: "#120F0F", stopOpacity: 0.32 })] }), jsx("clipPath", { id: "generative-design_svg__a", children: jsx("path", { fill: "#fff", d: "M0 0h52v52H0z" }) })] })] }));
const Memo = memo(SvgGenerativeDesign);
export { Memo as default };