UNPKG

@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) 12.4 kB
import { jsxs, jsx } from 'react/jsx-runtime'; import { memo } from 'react'; const SvgMarc = (props) => (jsxs("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", viewBox: "0 0 52 52", ...props, children: [jsxs("g", { clipPath: "url(#marc_svg__a)", children: [jsx("path", { fill: "#fff", d: "M0 16.25C0 7.277 7.277 0 16.25 0h19.5C44.723 0 52 7.277 52 16.25v19.5C52 44.723 44.723 52 35.75 52h-19.5C7.277 52 0 44.723 0 35.75v-19.5Z" }), jsx("path", { fill: "#F95B61", d: "M0 16.25C0 7.277 7.277 0 16.25 0h19.5C44.723 0 52 7.277 52 16.25v19.5C52 44.723 44.723 52 35.75 52h-19.5C7.277 52 0 44.723 0 35.75v-19.5Z" }), jsx("path", { fill: "#0D0D0D", d: "M18.48 12.975v8.683l-7.521 4.347V8.633l7.52 4.342Z" }), jsx("path", { fill: "#0D0D0D", d: "m10.959 26.005 7.515 4.342-7.515 4.342v-8.684ZM18.48 30.347l7.515 4.342-7.516 4.342v-8.684ZM26 17.316l-7.52-4.341L26 8.633v8.683ZM26 17.316l-7.52 4.342v8.689L26 26v-8.684ZM41.041 25.995l-7.515-4.342 7.515-4.342v8.684Z" }), jsx("path", { fill: "#0D0D0D", d: "M41.041 25.995v17.372l-7.52-4.342v-8.683l7.52-4.347ZM33.52 21.653l-7.515-4.342 7.515-4.341v8.683ZM26 34.684l7.52 4.341L26 43.367v-8.683ZM26 34.684l7.52-4.342v-8.689L26 26v8.684Z" }), jsx("path", { fill: "url(#marc_svg__b)", d: "m18.48 21.658-7.521 4.347v-8.689", opacity: 0.24 }), jsx("path", { fill: "url(#marc_svg__c)", d: "M10.959 17.316V8.633l7.52 4.342v8.683", opacity: 0.8 }), jsx("path", { fill: "url(#marc_svg__d)", d: "m26 8.633-7.52 4.342L26 17.316V8.633Z", opacity: 0.8 }), jsx("path", { fill: "url(#marc_svg__e)", d: "M26 26v-8.684l-7.52 4.342" }), jsx("path", { fill: "url(#marc_svg__f)", d: "m41.041 17.311-7.515 4.342 7.515 4.342V17.31Z", opacity: 0.8 }), jsx("path", { fill: "url(#marc_svg__g)", d: "M41.041 34.684v-8.69l-7.52 4.348", opacity: 0.8 }), jsx("path", { fill: "url(#marc_svg__h)", d: "m33.52 12.97-7.515 4.341 7.515 4.342V12.97Z", opacity: 0.8 }), jsx("path", { fill: "url(#marc_svg__i)", d: "M33.52 30.342v-8.689L26 26" }), jsx("path", { fill: "url(#marc_svg__j)", d: "m10.959 26.005 7.515 4.342-7.515 4.342v-8.684Z", opacity: 0.24 }), jsx("path", { fill: "url(#marc_svg__k)", d: "m18.48 30.347 7.515 4.342-7.516 4.342v-8.684Z", opacity: 0.24 }), jsx("path", { fill: "url(#marc_svg__l)", d: "m26 17.316-7.52 4.342v8.689L26 26v-8.684Z", opacity: 0.24 }), jsx("path", { fill: "url(#marc_svg__m)", d: "M41.041 34.684v8.683l-7.52-4.342v-8.683", opacity: 0.24 }), jsx("path", { fill: "url(#marc_svg__n)", d: "m26 34.684 7.52 4.341L26 43.367v-8.683Z", opacity: 0.24 }), jsx("path", { fill: "url(#marc_svg__o)", d: "m26 34.684 7.52-4.342v-8.689L26 26v8.684Z", opacity: 0.24 })] }), jsxs("defs", { children: [jsxs("linearGradient", { id: "marc_svg__b", x1: 9.158, x2: 16.82, y1: 20.703, y2: 24.778, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.222, stopColor: "#100E0E", stopOpacity: 0.222 }), jsx("stop", { offset: 0.361, stopColor: "#181111", stopOpacity: 0.361 }), jsx("stop", { offset: 0.477, stopColor: "#271616", stopOpacity: 0.477 }), jsx("stop", { offset: 0.581, stopColor: "#3C1C1E", stopOpacity: 0.581 }), jsx("stop", { offset: 0.677, stopColor: "#562527", stopOpacity: 0.677 }), jsx("stop", { offset: 0.766, stopColor: "#773033", stopOpacity: 0.766 }), jsx("stop", { offset: 0.851, stopColor: "#9F3D41", stopOpacity: 0.851 }), jsx("stop", { offset: 0.93, stopColor: "#CB4C51", stopOpacity: 0.93 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "marc_svg__c", x1: 9.09, x2: 20.351, y1: 12.152, y2: 18.139, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.035, stopColor: "#EF585E", stopOpacity: 0.965 }), jsx("stop", { offset: 0.395, stopColor: "#90383B", stopOpacity: 0.605 }), jsx("stop", { offset: 0.686, stopColor: "#492122", stopOpacity: 0.314 }), jsx("stop", { offset: 0.894, stopColor: "#1E1313", stopOpacity: 0.105 }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "marc_svg__d", x1: 20.137, x2: 27.798, y1: 9.858, y2: 13.932, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.035, stopColor: "#EF585E", stopOpacity: 0.965 }), jsx("stop", { offset: 0.395, stopColor: "#90383B", stopOpacity: 0.605 }), jsx("stop", { offset: 0.686, stopColor: "#492122", stopOpacity: 0.314 }), jsx("stop", { offset: 0.894, stopColor: "#1E1313", stopOpacity: 0.105 }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "marc_svg__e", x1: 20.137, x2: 27.8, y1: 18.541, y2: 22.616, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.035, stopColor: "#EF585E", stopOpacity: 0.965 }), jsx("stop", { offset: 0.395, stopColor: "#90383B", stopOpacity: 0.605 }), jsx("stop", { offset: 0.686, stopColor: "#492122", stopOpacity: 0.314 }), jsx("stop", { offset: 0.894, stopColor: "#1E1313", stopOpacity: 0.105 }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "marc_svg__f", x1: 35.181, x2: 42.842, y1: 18.536, y2: 22.61, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.035, stopColor: "#EF585E", stopOpacity: 0.965 }), jsx("stop", { offset: 0.395, stopColor: "#90383B", stopOpacity: 0.605 }), jsx("stop", { offset: 0.686, stopColor: "#492122", stopOpacity: 0.314 }), jsx("stop", { offset: 0.894, stopColor: "#1E1313", stopOpacity: 0.105 }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "marc_svg__g", x1: 35.18, x2: 42.843, y1: 27.222, y2: 31.297, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.035, stopColor: "#EF585E", stopOpacity: 0.965 }), jsx("stop", { offset: 0.395, stopColor: "#90383B", stopOpacity: 0.605 }), jsx("stop", { offset: 0.686, stopColor: "#492122", stopOpacity: 0.314 }), jsx("stop", { offset: 0.894, stopColor: "#1E1313", stopOpacity: 0.105 }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "marc_svg__h", x1: 27.66, x2: 35.321, y1: 14.194, y2: 18.267, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.035, stopColor: "#EF585E", stopOpacity: 0.965 }), jsx("stop", { offset: 0.395, stopColor: "#90383B", stopOpacity: 0.605 }), jsx("stop", { offset: 0.686, stopColor: "#492122", stopOpacity: 0.314 }), jsx("stop", { offset: 0.894, stopColor: "#1E1313", stopOpacity: 0.105 }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "marc_svg__i", x1: 27.659, x2: 35.322, y1: 22.88, y2: 26.955, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#F95B61" }), jsx("stop", { offset: 0.035, stopColor: "#EF585E", stopOpacity: 0.965 }), jsx("stop", { offset: 0.395, stopColor: "#90383B", stopOpacity: 0.605 }), jsx("stop", { offset: 0.686, stopColor: "#492122", stopOpacity: 0.314 }), jsx("stop", { offset: 0.894, stopColor: "#1E1313", stopOpacity: 0.105 }), jsx("stop", { offset: 1, stopColor: "#0D0D0D", stopOpacity: 0 })] }), jsxs("linearGradient", { id: "marc_svg__j", x1: 9.158, x2: 16.819, y1: 29.391, y2: 33.465, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.222, stopColor: "#100E0E", stopOpacity: 0.222 }), jsx("stop", { offset: 0.361, stopColor: "#181111", stopOpacity: 0.361 }), jsx("stop", { offset: 0.477, stopColor: "#271616", stopOpacity: 0.477 }), jsx("stop", { offset: 0.581, stopColor: "#3C1C1E", stopOpacity: 0.581 }), jsx("stop", { offset: 0.677, stopColor: "#562527", stopOpacity: 0.677 }), jsx("stop", { offset: 0.766, stopColor: "#773033", stopOpacity: 0.766 }), jsx("stop", { offset: 0.851, stopColor: "#9F3D41", stopOpacity: 0.851 }), jsx("stop", { offset: 0.93, stopColor: "#CB4C51", stopOpacity: 0.93 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "marc_svg__k", x1: 16.679, x2: 24.34, y1: 33.734, y2: 37.807, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.222, stopColor: "#100E0E", stopOpacity: 0.222 }), jsx("stop", { offset: 0.361, stopColor: "#181111", stopOpacity: 0.361 }), jsx("stop", { offset: 0.477, stopColor: "#271616", stopOpacity: 0.477 }), jsx("stop", { offset: 0.581, stopColor: "#3C1C1E", stopOpacity: 0.581 }), jsx("stop", { offset: 0.677, stopColor: "#562527", stopOpacity: 0.677 }), jsx("stop", { offset: 0.766, stopColor: "#773033", stopOpacity: 0.766 }), jsx("stop", { offset: 0.851, stopColor: "#9F3D41", stopOpacity: 0.851 }), jsx("stop", { offset: 0.93, stopColor: "#CB4C51", stopOpacity: 0.93 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "marc_svg__l", x1: 18.406, x2: 26.069, y1: 21.795, y2: 25.87, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.222, stopColor: "#100E0E", stopOpacity: 0.222 }), jsx("stop", { offset: 0.361, stopColor: "#181111", stopOpacity: 0.361 }), jsx("stop", { offset: 0.477, stopColor: "#271616", stopOpacity: 0.477 }), jsx("stop", { offset: 0.581, stopColor: "#3C1C1E", stopOpacity: 0.581 }), jsx("stop", { offset: 0.677, stopColor: "#562527", stopOpacity: 0.677 }), jsx("stop", { offset: 0.766, stopColor: "#773033", stopOpacity: 0.766 }), jsx("stop", { offset: 0.851, stopColor: "#9F3D41", stopOpacity: 0.851 }), jsx("stop", { offset: 0.93, stopColor: "#CB4C51", stopOpacity: 0.93 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "marc_svg__m", x1: 31.65, x2: 42.91, y1: 33.861, y2: 39.848, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.222, stopColor: "#100E0E", stopOpacity: 0.222 }), jsx("stop", { offset: 0.361, stopColor: "#181111", stopOpacity: 0.361 }), jsx("stop", { offset: 0.477, stopColor: "#271616", stopOpacity: 0.477 }), jsx("stop", { offset: 0.581, stopColor: "#3C1C1E", stopOpacity: 0.581 }), jsx("stop", { offset: 0.677, stopColor: "#562527", stopOpacity: 0.677 }), jsx("stop", { offset: 0.766, stopColor: "#773033", stopOpacity: 0.766 }), jsx("stop", { offset: 0.851, stopColor: "#9F3D41", stopOpacity: 0.851 }), jsx("stop", { offset: 0.93, stopColor: "#CB4C51", stopOpacity: 0.93 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "marc_svg__n", x1: 24.202, x2: 31.863, y1: 38.069, y2: 42.142, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.222, stopColor: "#100E0E", stopOpacity: 0.222 }), jsx("stop", { offset: 0.361, stopColor: "#181111", stopOpacity: 0.361 }), jsx("stop", { offset: 0.477, stopColor: "#271616", stopOpacity: 0.477 }), jsx("stop", { offset: 0.581, stopColor: "#3C1C1E", stopOpacity: 0.581 }), jsx("stop", { offset: 0.677, stopColor: "#562527", stopOpacity: 0.677 }), jsx("stop", { offset: 0.766, stopColor: "#773033", stopOpacity: 0.766 }), jsx("stop", { offset: 0.851, stopColor: "#9F3D41", stopOpacity: 0.851 }), jsx("stop", { offset: 0.93, stopColor: "#CB4C51", stopOpacity: 0.93 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsxs("linearGradient", { id: "marc_svg__o", x1: 25.93, x2: 33.593, y1: 26.131, y2: 30.206, gradientUnits: "userSpaceOnUse", children: [jsx("stop", { stopColor: "#0D0D0D", stopOpacity: 0 }), jsx("stop", { offset: 0.222, stopColor: "#100E0E", stopOpacity: 0.222 }), jsx("stop", { offset: 0.361, stopColor: "#181111", stopOpacity: 0.361 }), jsx("stop", { offset: 0.477, stopColor: "#271616", stopOpacity: 0.477 }), jsx("stop", { offset: 0.581, stopColor: "#3C1C1E", stopOpacity: 0.581 }), jsx("stop", { offset: 0.677, stopColor: "#562527", stopOpacity: 0.677 }), jsx("stop", { offset: 0.766, stopColor: "#773033", stopOpacity: 0.766 }), jsx("stop", { offset: 0.851, stopColor: "#9F3D41", stopOpacity: 0.851 }), jsx("stop", { offset: 0.93, stopColor: "#CB4C51", stopOpacity: 0.93 }), jsx("stop", { offset: 1, stopColor: "#F95B61" })] }), jsx("clipPath", { id: "marc_svg__a", children: jsx("path", { fill: "#fff", d: "M0 0h52v52H0z" }) })] })] })); const Memo = memo(SvgMarc); export { Memo as default };