@nexusui/branding/Elements.js

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.

import { jsxs, jsx } from 'react/jsx-runtime';
import { memo } from 'react';

const SvgElements = (props) => (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 52 52", ...props, children: [jsxs("g", { clipPath: "url(#elements_svg__a)", children: [jsx("path", { fill: "#fff", 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: "#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: "#000", d: "M13.447 10.621V32.79l5.169-2.984V7.637l-5.17 2.984Z" }), jsx("path", { fill: "#000", d: "m38.553 18.296-5.907 3.41-19.2-11.085 5.908-3.41 19.199 11.084ZM13.447 33.705l5.907-3.41 19.199 11.084-5.907 3.41-19.2-11.084Z" }), jsx("path", { fill: "#000", d: "m32.646 22.559 5.907-3.41v22.23l-5.907 3.41V22.56ZM19.355 21.706v-6.822l12.552 7.248v6.821l-12.552-7.247ZM19.354 22.559l12.553 7.247v6.821l-12.553-7.248v-6.82Z" }), jsx("path", { fill: "url(#elements_svg__b)", d: "m32.646 22.559 5.907-3.41v22.23l-5.907 3.41V22.56Z", opacity: 0.32 }), jsx("path", { fill: "url(#elements_svg__c)", d: "m19.354 30.294-5.907 3.41L32.646 44.79v-6.821l-13.292-7.674Z", opacity: 0.24 }), jsx("path", { fill: "url(#elements_svg__d)", d: "M19.355 21.706v-6.822l12.552 7.248v6.821l-12.552-7.247Z", opacity: 0.4 }), jsx("path", { fill: "url(#elements_svg__e)", d: "m19.354 22.559 12.553 7.247v6.821l-12.553-7.248v-6.82Z", opacity: 0.4 }), jsx("path", { fill: "url(#elements_svg__f)", d: "m38.553 18.296-5.907 3.41-19.2-11.085 5.908-3.41 19.199 11.084Z", opacity: 0.64 }), jsxs("g", { opacity: 0.4, children: [jsx("path", { fill: "url(#elements_svg__g)", d: "m18.616 7.638-5.17 2.983 5.17-2.984Z", opacity: 0.64 }), jsx("path", { fill: "url(#elements_svg__h)", d: "M13.447 10.621V32.79l5.169-2.984v-16.2l-5.17-2.985Z", opacity: 0.64 })] })] }), jsxs("defs", { children: [jsxs("linearGradient", { id: "elements_svg__b", x1: 29.396, x2: 41.803, y1: 28.67, y2: 35.267, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "elements_svg__c", x1: 14.623, x2: 34.185, y1: 31.492, y2: 41.894, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.03, stopColor: "#241415", stopOpacity: 0.1 }), jsx("stop", { offset: 0.09, stopColor: "#502325", stopOpacity: 0.29 }), jsx("stop", { offset: 0.16, stopColor: "#783033", stopOpacity: 0.46 }), jsx("stop", { offset: 0.23, stopColor: "#9B3C3F", stopOpacity: 0.6 }), jsx("stop", { offset: 0.31, stopColor: "#B8454A", stopOpacity: 0.73 }), jsx("stop", { offset: 0.4, stopColor: "#D04D52", stopOpacity: 0.83 }), jsx("stop", { offset: 0.49, stopColor: "#E25358", stopOpacity: 0.9 }), jsx("stop", { offset: 0.6, stopColor: "#EF575D", stopOpacity: 0.96 }), jsx("stop", { offset: 0.74, stopColor: "#F65A60", stopOpacity: 0.99 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "elements_svg__d", x1: 17.822, x2: 33.44, y1: 17.767, y2: 26.071, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0E0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.29, stopColor: "#60282A", stopOpacity: 0.36 }), jsx("stop", { offset: 0.54, stopColor: "#A23E42", stopOpacity: 0.63 }), jsx("stop", { offset: 0.75, stopColor: "#D14D52", stopOpacity: 0.83 }), jsx("stop", { offset: 0.91, stopColor: "#EE575D", stopOpacity: 0.95 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "elements_svg__e", x1: 17.822, x2: 33.44, y1: 25.44, y2: 33.745, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0E0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.29, stopColor: "#60282A", stopOpacity: 0.36 }), jsx("stop", { offset: 0.54, stopColor: "#A23E42", stopOpacity: 0.63 }), jsx("stop", { offset: 0.75, stopColor: "#D14D52", stopOpacity: 0.83 }), jsx("stop", { offset: 0.91, stopColor: "#EE575D", stopOpacity: 0.95 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "elements_svg__f", x1: 14.623, x2: 37.376, y1: 8.409, y2: 20.508, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "elements_svg__g", x1: 14.635, x2: 17.428, y1: 8.387, y2: 9.872, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "elements_svg__h", x1: 8.853, x2: 20.834, y1: 19.263, y2: 25.634, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsx("clipPath", { id: "elements_svg__a", children: jsx("path", { fill: "#fff", d: "M0 0h52v52H0z" }) })] })] }));
const Memo = memo(SvgElements);

export { Memo as default };