droplinked-editor-configs 1.8.0

package/src/assets/icon/System/Leaf/LeafLg.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LeafLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M14 11C11.5778 13.3167 9.15569 19 9.15569 19C9.15569 19 7.46021 14.1802 4 12.334" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M19.6962 5.52435L20.1222 9.94823C20.3985 12.8181 18.2467 15.3733 15.3769 15.6497C12.5609 15.9208 10.01 13.8625 9.73878 11.0466C9.46768 8.23062 11.5306 5.72803 14.3466 5.45689L19.0634 5.00271C19.3822 4.97201 19.6655 5.20556 19.6962 5.52435Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Leaf/LeafMd.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LeafMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M11.6663 9.16667C9.64788 11.0973 7.62941 15.8333 7.62941 15.8333C7.62941 15.8333 6.21651 11.8168 3.33301 10.2783" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M16.4135 4.60363L16.7685 8.2902C16.9987 10.6818 15.2056 12.8111 12.8141 13.0414C10.4674 13.2674 8.34165 11.5521 8.11565 9.20553C7.88973 6.85886 9.60882 4.77336 11.9555 4.54741L15.8861 4.16893C16.1518 4.14335 16.3879 4.33797 16.4135 4.60363Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Leaf/LeafSm.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LeafSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M9.33366 7.33333C7.71889 8.8778 6.10412 12.6667 6.10412 12.6667C6.10412 12.6667 4.9738 9.45343 2.66699 8.22266" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M13.1308 3.6829L13.4148 6.63215C13.599 8.54542 12.1645 10.2489 10.2513 10.4331C8.37392 10.6139 6.67332 9.24168 6.49252 7.36442C6.31179 5.48708 7.68705 3.81868 9.56439 3.63792L12.7089 3.33514C12.9215 3.31467 13.1103 3.47037 13.1308 3.6829Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Letter/LetterLg.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LetterLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M7 9L12 12.5L17 9" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M2 17V7C2 5.89543 2.89543 5 4 5H20C21.1046 5 22 5.89543 22 7V17C22 18.1046 21.1046 19 20 19H4C2.89543 19 2 18.1046 2 17Z" stroke={color} strokeWidth="2" />
+    </svg>
+
+);

package/src/assets/icon/System/Letter/LetterMd.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LetterMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M5.83301 7.5L9.99967 10.4167L14.1663 7.5" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M1.66699 14.1667V5.83334C1.66699 4.91286 2.41318 4.16667 3.33366 4.16667H16.667C17.5875 4.16667 18.3337 4.91286 18.3337 5.83334V14.1667C18.3337 15.0872 17.5875 15.8333 16.667 15.8333H3.33366C2.41318 15.8333 1.66699 15.0872 1.66699 14.1667Z" stroke={color} strokeWidth="1.5" />
+    </svg>
+
+);

package/src/assets/icon/System/Letter/LetterSm.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LetterSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M4.66699 6L8.00033 8.33333L11.3337 6" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M1.33301 11.3333V4.66666C1.33301 3.93028 1.92996 3.33333 2.66634 3.33333H13.333C14.0694 3.33333 14.6663 3.93028 14.6663 4.66666V11.3333C14.6663 12.0697 14.0694 12.6667 13.333 12.6667H2.66634C1.92996 12.6667 1.33301 12.0697 1.33301 11.3333Z" stroke={color} />
+    </svg>
+
+);

package/src/assets/icon/System/Light1/Light1Lg.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const Light1Lg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M10 17.6586V20C10 21.1046 10.8954 22 12 22C13.1046 22 14 21.1046 14 20V17.6586M12 2V3M3 12H2M5.5 5.5L4.8999 4.8999M18.5 5.5L19.1002 4.8999M22 12H21M18 12C18 15.3137 15.3137 18 12 18C8.68629 18 6 15.3137 6 12C6 8.68629 8.68629 6 12 6C15.3137 6 18 8.68629 18 12Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Light1/Light1Md.tsx

@@ -0,0 +1,16 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const Light1Md = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <g clip-path="url(#clip0_8234_5103)">
+            <path d="M8.33317 14.7155V16.6667C8.33317 17.5871 9.07936 18.3333 9.99984 18.3333C10.9203 18.3333 11.6665 17.5871 11.6665 16.6667V14.7155M9.99984 1.66667V2.50001M2.49984 10H1.6665M4.58317 4.58334L4.08309 4.08326M15.4165 4.58334L15.9167 4.08326M18.3332 10H17.4998M14.9998 10C14.9998 12.7614 12.7613 15 9.99984 15C7.23841 15 4.99984 12.7614 4.99984 10C4.99984 7.23858 7.23841 5.00001 9.99984 5.00001C12.7613 5.00001 14.9998 7.23858 14.9998 10Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        </g>
+        <defs>
+            <clipPath id="clip0_8234_5103">
+                <rect width="20" height="20" fill="white" />
+            </clipPath>
+        </defs>
+    </svg>
+
+);

package/src/assets/icon/System/Light1/Light1Sm.tsx

@@ -0,0 +1,16 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const Light1Sm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <g clip-path="url(#clip0_8234_5101)">
+            <path d="M6.66683 11.7724V13.3333C6.66683 14.0697 7.26378 14.6667 8.00016 14.6667C8.73654 14.6667 9.3335 14.0697 9.3335 13.3333V11.7724M8.00016 1.33333V1.99999M2.00016 7.99999H1.3335M3.66683 3.66666L3.26676 3.2666M12.3335 3.66666L12.7337 3.2666M14.6668 7.99999H14.0002M12.0002 7.99999C12.0002 10.2091 10.2093 12 8.00016 12C5.79102 12 4.00016 10.2091 4.00016 7.99999C4.00016 5.79086 5.79102 3.99999 8.00016 3.99999C10.2093 3.99999 12.0002 5.79086 12.0002 7.99999Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        </g>
+        <defs>
+            <clipPath id="clip0_8234_5101">
+                <rect width="16" height="16" fill="white" />
+            </clipPath>
+        </defs>
+    </svg>
+
+);

package/src/assets/icon/System/Light2/Light2Lg.tsx

@@ -0,0 +1,11 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const Light2Lg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M14.5033 16.755C14.6447 14.9641 16.412 13.1961 17.2014 12.065C17.9908 10.9339 18.2854 9.84997 18.2854 8.54215C18.2736 5.06642 15.4695 2.2505 11.9937 2.2505C8.52979 2.2505 5.71387 5.06642 5.71387 8.53037C5.71387 9.83818 6.00842 10.9221 6.79782 12.0532C7.58723 13.1843 9.34276 14.9523 9.49593 16.7432" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M8.53806 8.65803C8.53806 8.18032 8.63215 7.70729 8.81496 7.26594C8.99778 6.82459 9.26573 6.42357 9.60352 6.08578C9.94132 5.74798 10.3423 5.48003 10.7837 5.29722C11.225 5.1144 11.6981 5.02031 12.1758 5.02031" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M14.5723 19.1752V18.8815H9.42578V19.1752C9.42578 20.5964 10.5779 21.7484 11.999 21.7484C13.4202 21.7484 14.5723 20.5964 14.5723 19.1752Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Light2/Light2Md.tsx

@@ -0,0 +1,11 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const Light2Md = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M12.0863 13.9625C12.2041 12.4701 13.6769 10.9967 14.3347 10.0542C14.9925 9.1116 15.238 8.2083 15.238 7.11846C15.2282 4.22202 12.8914 1.87541 9.99495 1.87541C7.10832 1.87541 4.76172 4.22202 4.76172 7.10864C4.76172 8.19849 5.00718 9.10178 5.66502 10.0444C6.32285 10.9869 7.7858 12.4603 7.91344 13.9527" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M7.11505 7.21503C7.11505 6.81693 7.19346 6.42274 7.3458 6.05495C7.49815 5.68716 7.72144 5.35297 8.00294 5.07148C8.28443 4.78998 8.61861 4.56669 8.9864 4.41435C9.3542 4.262 9.74839 4.18359 10.1465 4.18359" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M12.1442 15.9793V15.7346H7.85547V15.9793C7.85547 17.1636 8.81554 18.1237 9.99984 18.1237C11.1841 18.1237 12.1442 17.1636 12.1442 15.9793Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Light2/Light2Sm.tsx

@@ -0,0 +1,11 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const Light2Sm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M9.66921 11.17C9.76347 9.97608 10.9417 8.7974 11.468 8.04334C11.9942 7.28929 12.1906 6.56665 12.1906 5.69477C12.1827 3.37762 10.3133 1.50034 7.99615 1.50034C5.68686 1.50034 3.80957 3.37762 3.80957 5.68692C3.80957 6.55879 4.00594 7.28143 4.53221 8.03549C5.05848 8.78954 6.22883 9.96823 6.33095 11.1621" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M5.69204 5.77202C5.69204 5.45354 5.75477 5.13819 5.87664 4.84395C5.99852 4.54972 6.17715 4.28238 6.40235 4.05718C6.62754 3.83198 6.89489 3.65335 7.18912 3.53147C7.48336 3.4096 7.79871 3.34687 8.11719 3.34687" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M9.71518 12.7835V12.5877H6.28418V12.7835C6.28418 13.7309 7.05224 14.499 7.99968 14.499C8.94712 14.499 9.71518 13.7309 9.71518 12.7835Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Location/LocationLg.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LocationLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M21 10C21 17 12 23 12 23C12 23 3 17 3 10C3 7.61305 3.94821 5.32387 5.63604 3.63604C7.32387 1.94821 9.61305 1 12 1C14.3869 1 16.6761 1.94821 18.364 3.63604C20.0518 5.32387 21 7.61305 21 10Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M12 13C13.6569 13 15 11.6569 15 10C15 8.34315 13.6569 7 12 7C10.3431 7 9 8.34315 9 10C9 11.6569 10.3431 13 12 13Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Location/LocationMd.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LocationMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M17.5 8.33333C17.5 14.1667 10 19.1667 10 19.1667C10 19.1667 2.5 14.1667 2.5 8.33333C2.5 6.34421 3.29018 4.43656 4.6967 3.03003C6.10322 1.62351 8.01088 0.833334 10 0.833334C11.9891 0.833334 13.8968 1.62351 15.3033 3.03003C16.7098 4.43656 17.5 6.34421 17.5 8.33333Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M10 10.8333C11.3807 10.8333 12.5 9.71405 12.5 8.33333C12.5 6.95262 11.3807 5.83333 10 5.83333C8.61929 5.83333 7.5 6.95262 7.5 8.33333C7.5 9.71405 8.61929 10.8333 10 10.8333Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Location/LocationSm.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LocationSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M14 6.66667C14 11.3333 8 15.3333 8 15.3333C8 15.3333 2 11.3333 2 6.66667C2 5.07537 2.63214 3.54924 3.75736 2.42402C4.88258 1.29881 6.4087 0.666666 8 0.666666C9.5913 0.666666 11.1174 1.29881 12.2426 2.42402C13.3679 3.54924 14 5.07537 14 6.66667Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M8 8.66667C9.10457 8.66667 10 7.77124 10 6.66667C10 5.5621 9.10457 4.66667 8 4.66667C6.89543 4.66667 6 5.5621 6 6.66667C6 7.77124 6.89543 8.66667 8 8.66667Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Lock/LockLg.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LockLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M16 11.4667H17.4C17.7314 11.4667 18 11.7532 18 12.1067V19.36C18 19.7135 17.7314 20 17.4 20H6.6C6.26863 20 6 19.7135 6 19.36V12.1067C6 11.7532 6.26863 11.4667 6.6 11.4667H8M16 11.4667V8.26667C16 6.84445 15.2 4 12 4C8.8 4 8 6.84445 8 8.26667V11.4667M16 11.4667H8" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Lock/LockMd.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LockMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M13.3333 9.55556H14.5C14.7762 9.55556 15 9.79431 15 10.0889V16.1333C15 16.4279 14.7762 16.6667 14.5 16.6667H5.5C5.22386 16.6667 5 16.4279 5 16.1333V10.0889C5 9.79431 5.22386 9.55556 5.5 9.55556H6.66667M13.3333 9.55556V6.88889C13.3333 5.70371 12.6667 3.33333 10 3.33333C7.33333 3.33333 6.66667 5.70371 6.66667 6.88889V9.55556M13.3333 9.55556H6.66667" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Lock/LockSm.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const LockSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M10.6667 7.64444H11.6C11.8209 7.64444 12 7.83545 12 8.07111V12.9067C12 13.1423 11.8209 13.3333 11.6 13.3333H4.4C4.17909 13.3333 4 13.1423 4 12.9067V8.07111C4 7.83545 4.17909 7.64444 4.4 7.64444H5.33333M10.6667 7.64444V5.51111C10.6667 4.56296 10.1333 2.66667 8 2.66667C5.86667 2.66667 5.33333 4.56296 5.33333 5.51111V7.64444M10.6667 7.64444H5.33333" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/MedalStar/MedalstarLg.tsx

@@ -0,0 +1,11 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MedalstarLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M19 9C19 10.45 18.57 11.78 17.83 12.89C16.75 14.49 15.04 15.62 13.05 15.91C12.71 15.97 12.36 16 12 16C11.64 16 11.29 15.97 10.95 15.91C8.96 15.62 7.25 14.49 6.17 12.89C5.43 11.78 5 10.45 5 9C5 5.13 8.13 2 12 2C15.87 2 19 5.13 19 9Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M21.2501 18.47L19.6001 18.86C19.2301 18.95 18.9401 19.23 18.8601 19.6L18.5101 21.07C18.3201 21.87 17.3001 22.11 16.7701 21.48L12.0001 16L7.23008 21.49C6.70008 22.12 5.68008 21.88 5.49008 21.08L5.14008 19.61C5.05008 19.24 4.76008 18.95 4.40008 18.87L2.75008 18.48C1.99008 18.3 1.72008 17.35 2.27008 16.8L6.17008 12.9C7.25008 14.5 8.96008 15.63 10.9501 15.92C11.2901 15.98 11.6401 16.01 12.0001 16.01C12.3601 16.01 12.7101 15.98 13.0501 15.92C15.0401 15.63 16.7501 14.5 17.8301 12.9L21.7301 16.8C22.2801 17.34 22.0101 18.29 21.2501 18.47Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M12.58 5.98L13.17 7.15999C13.25 7.31999 13.46 7.48 13.65 7.51L14.72 7.68999C15.4 7.79999 15.56 8.3 15.07 8.79L14.24 9.61998C14.1 9.75998 14.02 10.03 14.07 10.23L14.31 11.26C14.5 12.07 14.07 12.39 13.35 11.96L12.35 11.37C12.17 11.26 11.87 11.26 11.69 11.37L10.69 11.96C9.96997 12.38 9.53997 12.07 9.72997 11.26L9.96997 10.23C10.01 10.04 9.93997 9.75998 9.79997 9.61998L8.96997 8.79C8.47997 8.3 8.63997 7.80999 9.31997 7.68999L10.39 7.51C10.57 7.48 10.78 7.31999 10.86 7.15999L11.45 5.98C11.74 5.34 12.26 5.34 12.58 5.98Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/MedalStar/MedalstarMd.tsx

@@ -0,0 +1,11 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MedalstarMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M15.8332 7.50001C15.8332 8.70834 15.4748 9.81668 14.8582 10.7417C13.9582 12.075 12.5332 13.0167 10.8748 13.2583C10.5915 13.3083 10.2998 13.3333 9.99984 13.3333C9.69984 13.3333 9.40817 13.3083 9.12484 13.2583C7.4665 13.0167 6.0415 12.075 5.1415 10.7417C4.52484 9.81668 4.1665 8.70834 4.1665 7.50001C4.1665 4.27501 6.77484 1.66667 9.99984 1.66667C13.2248 1.66667 15.8332 4.27501 15.8332 7.50001Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M17.7082 15.3917L16.3332 15.7167C16.0249 15.7917 15.7832 16.025 15.7166 16.3333L15.4249 17.5583C15.2666 18.225 14.4166 18.425 13.9749 17.9L9.9999 13.3333L6.0249 17.9083C5.58324 18.4333 4.73324 18.2333 4.5749 17.5667L4.28324 16.3417C4.20824 16.0333 3.96657 15.7917 3.66657 15.725L2.29157 15.4C1.65824 15.25 1.43324 14.4583 1.89157 14L5.14157 10.75C6.04157 12.0833 7.46657 13.025 9.1249 13.2667C9.40824 13.3167 9.6999 13.3417 9.9999 13.3417C10.2999 13.3417 10.5916 13.3167 10.8749 13.2667C12.5332 13.025 13.9582 12.0833 14.8582 10.75L18.1082 14C18.5666 14.45 18.3416 15.2417 17.7082 15.3917Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M10.4831 4.98333L10.9748 5.96666C11.0415 6.09999 11.2165 6.23333 11.3748 6.25833L12.2665 6.40832C12.8331 6.49999 12.9665 6.91666 12.5581 7.32499L11.8665 8.01665C11.7498 8.13331 11.6831 8.35833 11.7248 8.52499L11.9248 9.38333C12.0831 10.0583 11.7248 10.325 11.1248 9.96665L10.2915 9.47498C10.1415 9.38331 9.89148 9.38331 9.74148 9.47498L8.90815 9.96665C8.30815 10.3166 7.94981 10.0583 8.10815 9.38333L8.30815 8.52499C8.34148 8.36666 8.28315 8.13331 8.16648 8.01665L7.47481 7.32499C7.06648 6.91666 7.19981 6.50832 7.76648 6.40832L8.65815 6.25833C8.80815 6.23333 8.98315 6.09999 9.04981 5.96666L9.54148 4.98333C9.78315 4.44999 10.2165 4.44999 10.4831 4.98333Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/MedalStar/MedalstarSm.tsx

@@ -0,0 +1,11 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MedalstarSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M12.6668 6C12.6668 6.96666 12.3802 7.85334 11.8868 8.59334C11.1668 9.66 10.0268 10.4133 8.70016 10.6067C8.4735 10.6467 8.24016 10.6667 8.00016 10.6667C7.76016 10.6667 7.52683 10.6467 7.30016 10.6067C5.9735 10.4133 4.8335 9.66 4.1135 8.59334C3.62016 7.85334 3.3335 6.96666 3.3335 6C3.3335 3.42 5.42016 1.33333 8.00016 1.33333C10.5802 1.33333 12.6668 3.42 12.6668 6Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M14.1669 12.3133L13.0669 12.5733C12.8202 12.6333 12.6269 12.82 12.5735 13.0667L12.3402 14.0467C12.2135 14.58 11.5335 14.74 11.1802 14.32L8.00022 10.6667L4.82022 14.3267C4.46688 14.7467 3.78688 14.5867 3.66022 14.0533L3.42688 13.0733C3.36688 12.8267 3.17355 12.6333 2.93355 12.58L1.83355 12.32C1.32688 12.2 1.14688 11.5667 1.51355 11.2L4.11355 8.59999C4.83355 9.66666 5.97355 10.42 7.30022 10.6133C7.52688 10.6533 7.76022 10.6733 8.00022 10.6733C8.24022 10.6733 8.47355 10.6533 8.70022 10.6133C10.0269 10.42 11.1669 9.66666 11.8869 8.59999L14.4869 11.2C14.8535 11.56 14.6735 12.1933 14.1669 12.3133Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M8.38681 3.98667L8.78014 4.77333C8.83348 4.88 8.97348 4.98667 9.10014 5.00667L9.81348 5.12667C10.2668 5.2 10.3735 5.53334 10.0468 5.86L9.49348 6.41333C9.40014 6.50666 9.34681 6.68667 9.38014 6.82L9.54014 7.50667C9.66681 8.04667 9.38014 8.25999 8.90014 7.97333L8.23348 7.57999C8.11348 7.50666 7.91348 7.50666 7.79348 7.57999L7.12681 7.97333C6.64681 8.25333 6.36014 8.04667 6.48681 7.50667L6.64681 6.82C6.67348 6.69334 6.62681 6.50666 6.53348 6.41333L5.98014 5.86C5.65348 5.53334 5.76014 5.20667 6.21348 5.12667L6.92681 5.00667C7.04681 4.98667 7.18681 4.88 7.24014 4.77333L7.63348 3.98667C7.82681 3.56001 8.17348 3.56001 8.38681 3.98667Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Metaverse/MetaverseLg.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MetaverseLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M12.0115 2L20.8228 7.08735V15.9563C20.8228 16.3532 20.7183 16.7431 20.5198 17.0868C20.3214 17.4305 20.036 17.7159 19.6922 17.9144L13.142 21.6971C12.7983 21.8955 12.4084 22 12.0115 22C11.6146 22 11.2247 21.8955 10.881 21.6971L4.33072 17.9144C3.987 17.7159 3.70158 17.4305 3.50313 17.0868C3.30468 16.7431 3.20021 16.3532 3.2002 15.9563V7.08735L12.0115 2Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M12.0114 6.52206V12.1747M12.0114 12.1747L7.11621 15.001M12.0114 12.1747L16.9065 15.001" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Metaverse/MetaverseMd.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MetaverseMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M10.0092 1.66666L17.352 5.90611V13.2969C17.352 13.6276 17.2649 13.9525 17.0995 14.239C16.9342 14.5254 16.6963 14.7632 16.4099 14.9286L10.9513 18.0809C10.6649 18.2463 10.34 18.3333 10.0092 18.3333C9.6785 18.3333 9.35358 18.2463 9.06714 18.0809L3.60861 14.9286C3.32218 14.7632 3.08432 14.5254 2.91895 14.239C2.75358 13.9525 2.66651 13.6276 2.6665 13.2969V5.90611L10.0092 1.66666Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M10.0095 5.43506V10.1456M10.0095 10.1456L5.93018 12.5008M10.0095 10.1456L14.0888 12.5008" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Metaverse/MetaverseSm.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MetaverseSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M8.00749 1.33334L13.8817 4.72491V10.6375C13.8817 10.9021 13.812 11.1621 13.6797 11.3912C13.5474 11.6203 13.3571 11.8106 13.128 11.9429L8.76117 14.4647C8.53203 14.597 8.27209 14.6667 8.00749 14.6667C7.74289 14.6667 7.48296 14.597 7.25381 14.4647L2.88698 11.9429C2.65784 11.8106 2.46756 11.6203 2.33526 11.3912C2.20296 11.1621 2.13331 10.9021 2.1333 10.6375V4.72491L8.00749 1.33334Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M8.00758 4.34805V8.11646M8.00758 8.11646L4.74414 10.0007M8.00758 8.11646L11.271 10.0007" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/MintToMerch/MinttomerchLg.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MinttomerchLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M14.4996 8.49998H14.5096M16.2196 19.9599L10.5508 14.2704C9.7579 13.4746 9.36143 13.0767 8.90391 12.9276C8.50148 12.7965 8.06782 12.7964 7.66534 12.9274C7.20776 13.0763 6.81115 13.4741 6.01792 14.2696L4.30299 15.9896M4.30299 15.9896L2.46148 12.8C2.29321 12.5085 2.20908 12.3628 2.17615 12.2079C2.14701 12.0708 2.14701 11.9291 2.17615 11.7921C2.20908 11.6371 2.29321 11.4914 2.46148 11.2L6.53772 4.13972C6.70598 3.84828 6.79011 3.70256 6.90782 3.59658C7.01196 3.50281 7.13465 3.43197 7.26793 3.38867C7.41856 3.33972 7.58683 3.33972 7.92336 3.33972H16.0758C16.4124 3.33972 16.5806 3.33972 16.7313 3.38867C16.8645 3.43197 16.9872 3.50281 17.0914 3.59658C17.2091 3.70256 17.2932 3.84828 17.4615 4.13972L21.5377 11.2C21.706 11.4914 21.7901 11.6371 21.823 11.7921C21.8522 11.9291 21.8522 12.0708 21.823 12.2079C21.7901 12.3628 21.706 12.5085 21.5377 12.8L18.8889 17.3879M4.30299 15.9896L6.53772 19.8602C6.70598 20.1517 6.79011 20.2974 6.90782 20.4034C7.01196 20.4971 7.13465 20.568 7.26793 20.6113C7.41856 20.6602 7.58683 20.6602 7.92336 20.6602H16.0758C16.4124 20.6602 16.5806 20.6602 16.7313 20.6113C16.8645 20.568 16.9872 20.4971 17.0914 20.4034C17.2091 20.2974 17.2932 20.1517 17.4615 19.8602L18.8889 17.3879M12.2385 15.9643L12.6069 15.595C13.4081 14.7995 13.8087 14.4017 14.2689 14.2553C14.6737 14.1266 15.109 14.1301 15.5117 14.2652C15.9696 14.419 16.3638 14.8231 17.1522 15.6313L18.8889 17.3879M14.9996 8.49998C14.9996 8.77612 14.7757 8.99998 14.4996 8.99998C14.2235 8.99998 13.9996 8.77612 13.9996 8.49998C13.9996 8.22383 14.2235 7.99998 14.4996 7.99998C14.7757 7.99998 14.9996 8.22383 14.9996 8.49998Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/MintToMerch/MinttomerchMd.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MinttomerchMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M12.0827 7.08331H12.091M13.516 16.6332L8.79201 11.892C8.13126 11.2288 7.80087 10.8972 7.4196 10.773C7.08424 10.6637 6.72286 10.6637 6.38746 10.7728C6.00614 10.8969 5.67563 11.2284 5.01461 11.8913L3.5855 13.3247M3.5855 13.3247L2.05091 10.6667C1.91068 10.4237 1.84058 10.3023 1.81313 10.1732C1.78885 10.059 1.78885 9.94091 1.81313 9.82675C1.84058 9.69758 1.91068 9.57616 2.05091 9.33333L5.44778 3.44976C5.58799 3.2069 5.6581 3.08546 5.75619 2.99715C5.84298 2.919 5.94522 2.85997 6.05628 2.82389C6.18181 2.7831 6.32203 2.7831 6.60248 2.7831H13.3962C13.6767 2.7831 13.8168 2.7831 13.9424 2.82389C14.0534 2.85997 14.1557 2.919 14.2425 2.99715C14.3406 3.08546 14.4107 3.2069 14.5509 3.44976L17.9478 9.33333C18.088 9.57616 18.1581 9.69758 18.1855 9.82675C18.2098 9.94091 18.2098 10.059 18.1855 10.1732C18.1581 10.3023 18.088 10.4237 17.9478 10.6667L15.7404 14.4899M3.5855 13.3247L5.44778 16.5502C5.58799 16.7931 5.6581 16.9145 5.75619 17.0028C5.84298 17.0809 5.94522 17.14 6.05628 17.1761C6.18181 17.2168 6.32203 17.2168 6.60248 17.2168H13.3962C13.6767 17.2168 13.8168 17.2168 13.9424 17.1761C14.0534 17.14 14.1557 17.0809 14.2425 17.0028C14.3406 16.9145 14.4107 16.7931 14.5509 16.5502L15.7404 14.4899M10.1984 13.3036L10.5054 12.9958C11.1731 12.3329 11.5069 12.0014 11.8904 11.8794C12.2278 11.7722 12.5905 11.7751 12.9261 11.8877C13.3077 12.0158 13.6362 12.3526 14.2932 13.0261L15.7404 14.4899M12.4993 7.08331C12.4993 7.31343 12.3128 7.49998 12.0827 7.49998C11.8526 7.49998 11.666 7.31343 11.666 7.08331C11.666 6.85319 11.8526 6.66665 12.0827 6.66665C12.3128 6.66665 12.4993 6.85319 12.4993 7.08331Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/MintToMerch/MinttomerchSm.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MinttomerchSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M9.66673 5.66666H9.67339M10.8134 13.3066L7.03419 9.51361C6.50559 8.98307 6.24128 8.71781 5.93627 8.61841C5.66798 8.53101 5.37887 8.53094 5.11055 8.61827C4.8055 8.71754 4.54109 8.98274 4.01227 9.51307L2.86899 10.6597M2.86899 10.6597L1.64131 8.53334C1.52913 8.33901 1.47305 8.24187 1.45109 8.13861C1.43167 8.04721 1.43167 7.95274 1.45109 7.86141C1.47305 7.75807 1.52913 7.66094 1.64131 7.46667L4.35881 2.75982C4.47098 2.56553 4.52707 2.46838 4.60554 2.39773C4.67497 2.33521 4.75676 2.28799 4.84561 2.25912C4.94603 2.22649 5.05821 2.22649 5.28257 2.22649H10.7175C10.9419 2.22649 11.0541 2.22649 11.1545 2.25912C11.2433 2.28799 11.3251 2.33521 11.3946 2.39773C11.4731 2.46838 11.5291 2.56553 11.6413 2.75982L14.3588 7.46667C14.471 7.66094 14.5271 7.75807 14.549 7.86141C14.5685 7.95274 14.5685 8.04721 14.549 8.13861C14.5271 8.24187 14.471 8.33901 14.3588 8.53334L12.5929 11.5919M2.86899 10.6597L4.35881 13.2401C4.47098 13.4345 4.52707 13.5316 4.60554 13.6023C4.67497 13.6647 4.75676 13.712 4.84561 13.7409C4.94603 13.7735 5.05821 13.7735 5.28257 13.7735H10.7175C10.9419 13.7735 11.0541 13.7735 11.1545 13.7409C11.2433 13.712 11.3251 13.6647 11.3946 13.6023C11.4731 13.5316 11.5291 13.4345 11.6413 13.2401L12.5929 11.5919M8.15933 10.6429L8.40493 10.3967C8.93906 9.86634 9.20613 9.60114 9.51293 9.50354C9.78279 9.41774 10.073 9.42007 10.3415 9.51014C10.6467 9.61267 10.9095 9.88207 11.4351 10.4209L12.5929 11.5919M10.0001 5.66666C10.0001 5.85075 9.85079 5.99999 9.66673 5.99999C9.48266 5.99999 9.33339 5.85075 9.33339 5.66666C9.33339 5.48256 9.48266 5.33333 9.66673 5.33333C9.85079 5.33333 10.0001 5.48256 10.0001 5.66666Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Moon/MoonLg.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MoonLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M3.32031 11.6835C3.32031 16.6541 7.34975 20.6835 12.3203 20.6835C16.1075 20.6835 19.3483 18.3444 20.6768 15.032C19.6402 15.4486 18.5059 15.6835 17.3203 15.6835C12.3497 15.6835 8.32031 11.654 8.32031 6.68345C8.32031 5.50341 8.55165 4.36262 8.96453 3.32999C5.65605 4.66031 3.32031 7.89915 3.32031 11.6835Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Moon/MoonMd.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MoonMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M2.7666 9.73625C2.7666 13.8784 6.12447 17.2362 10.2666 17.2362C13.4226 17.2362 16.1233 15.287 17.2303 12.5267C16.3665 12.8738 15.4213 13.0696 14.4333 13.0696C10.2911 13.0696 6.93327 9.71167 6.93327 5.56954C6.93327 4.58618 7.12605 3.63552 7.47012 2.77499C4.71305 3.88359 2.7666 6.58263 2.7666 9.73625Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Moon/MoonSm.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const MoonSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M2.21387 7.789C2.21387 11.1027 4.90016 13.789 8.21386 13.789C10.7387 13.789 12.8992 12.2296 13.7849 10.0213C13.0938 10.2991 12.3376 10.4557 11.5472 10.4557C8.23346 10.4557 5.5472 7.76933 5.5472 4.45563C5.5472 3.66894 5.70143 2.90841 5.97668 2.21999C3.77103 3.10687 2.21387 5.2661 2.21387 7.789Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/NFT/NftLg.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NftLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M17 19C17 20.1046 17.8954 21 19 21C20.1046 21 21 20.1046 21 19C21 17.8954 20.1046 17 19 17M17 19C17 17.8954 17.8954 17 19 17M17 19H7M19 17V7M7 19C7 20.1046 6.10457 21 5 21C3.89543 21 3 20.1046 3 19C3 17.8954 3.89543 17 5 17M7 19C7 17.8954 6.10457 17 5 17M19 7C17.8954 7 17 6.10457 17 5M19 7C20.1046 7 21 6.10457 21 5C21 3.89543 20.1046 3 19 3C17.8954 3 17 3.89543 17 5M5 17V7M5 7C3.89543 7 3 6.10457 3 5C3 3.89543 3.89543 3 5 3C6.10457 3 7 3.89543 7 5M5 7C6.10457 7 7 6.10457 7 5M7 5H17M10 15V9L14 15V9" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/NFT/NftMd.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NftMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M14.1667 15.8333C14.1667 16.7538 14.9128 17.5 15.8333 17.5C16.7538 17.5 17.5 16.7538 17.5 15.8333C17.5 14.9128 16.7538 14.1667 15.8333 14.1667M14.1667 15.8333C14.1667 14.9128 14.9128 14.1667 15.8333 14.1667M14.1667 15.8333H5.83333M15.8333 14.1667V5.83333M5.83333 15.8333C5.83333 16.7538 5.08714 17.5 4.16667 17.5C3.24619 17.5 2.5 16.7538 2.5 15.8333C2.5 14.9128 3.24619 14.1667 4.16667 14.1667M5.83333 15.8333C5.83333 14.9128 5.08714 14.1667 4.16667 14.1667M15.8333 5.83333C14.9128 5.83333 14.1667 5.08714 14.1667 4.16667M15.8333 5.83333C16.7538 5.83333 17.5 5.08714 17.5 4.16667C17.5 3.24619 16.7538 2.5 15.8333 2.5C14.9128 2.5 14.1667 3.24619 14.1667 4.16667M4.16667 14.1667V5.83333M4.16667 5.83333C3.24619 5.83333 2.5 5.08714 2.5 4.16667C2.5 3.24619 3.24619 2.5 4.16667 2.5C5.08714 2.5 5.83333 3.24619 5.83333 4.16667M4.16667 5.83333C5.08714 5.83333 5.83333 5.08714 5.83333 4.16667M5.83333 4.16667H14.1667M8.33333 12.5V7.5L11.6667 12.5V7.5" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/NFT/NftSm.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NftSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M11.3333 12.6667C11.3333 13.4031 11.9303 14 12.6667 14C13.4031 14 14 13.4031 14 12.6667C14 11.9303 13.4031 11.3333 12.6667 11.3333M11.3333 12.6667C11.3333 11.9303 11.9303 11.3333 12.6667 11.3333M11.3333 12.6667H4.66667M12.6667 11.3333V4.66667M4.66667 12.6667C4.66667 13.4031 4.06971 14 3.33333 14C2.59695 14 2 13.4031 2 12.6667C2 11.9303 2.59695 11.3333 3.33333 11.3333M4.66667 12.6667C4.66667 11.9303 4.06971 11.3333 3.33333 11.3333M12.6667 4.66667C11.9303 4.66667 11.3333 4.06971 11.3333 3.33333M12.6667 4.66667C13.4031 4.66667 14 4.06971 14 3.33333C14 2.59695 13.4031 2 12.6667 2C11.9303 2 11.3333 2.59695 11.3333 3.33333M3.33333 11.3333V4.66667M3.33333 4.66667C2.59695 4.66667 2 4.06971 2 3.33333C2 2.59695 2.59695 2 3.33333 2C4.06971 2 4.66667 2.59695 4.66667 3.33333M3.33333 4.66667C4.06971 4.66667 4.66667 4.06971 4.66667 3.33333M4.66667 3.33333H11.3333" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M6.66699 10C6.66699 8.4379 6.66699 6 6.66699 6L9.33366 10V6" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Network/NetworkLg.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NetworkLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M5 16L10 13M14 11L19 8M12 5V10M12 5C12.8284 5 13.5 4.32843 13.5 3.5M12 5C11.1716 5 10.5 4.32843 10.5 3.5M12 14V19M12 19C11.1716 19 10.5 19.6716 10.5 20.5M12 19C12.8284 19 13.5 19.6716 13.5 20.5M5 8L10 11M14 13L19 16M20.5 9V14.5M20.5 9C21.3284 9 22 8.32843 22 7.5C22 6.67157 21.3284 6 20.5 6C19.6716 6 19 6.67157 19 7.5C19 8.32843 19.6716 9 20.5 9ZM13.5 20.5L19 17.5M13.5 20.5C13.5 21.3284 12.8284 22 12 22C11.1716 22 10.5 21.3284 10.5 20.5M4.5 17.5L10.5 20.5M3.5 15V9M3.5 15C2.67157 15 2 15.6716 2 16.5C2 17.3284 2.67157 18 3.5 18C4.32843 18 5 17.3284 5 16.5C5 15.6716 4.32843 15 3.5 15ZM3.5 9C4.32843 9 5 8.32843 5 7.5C5 6.67157 4.32843 6 3.5 6C2.67157 6 2 6.67157 2 7.5C2 8.32843 2.67157 9 3.5 9ZM4.5 6.5L10.5 3.5M10.5 3.5C10.5 2.67157 11.1716 2 12 2C12.8284 2 13.5 2.67157 13.5 3.5M19.5 6.5L13.5 3.5M22 16.5C22 17.3284 21.3284 18 20.5 18C19.6716 18 19 17.3284 19 16.5C19 15.6716 19.6716 15 20.5 15C21.3284 15 22 15.6716 22 16.5ZM12 9.75L14 10.875V13.125L12 14.25L10 13.125V10.875L12 9.75Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Network/NetworkMd.tsx

@@ -0,0 +1,16 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NetworkMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <g clip-path="url(#clip0_10436_1186)">
+            <path d="M4.16699 13.3333L8.33366 10.8333M11.667 9.16667L15.8337 6.66667M10.0003 4.16667V8.33334M10.0003 4.16667C10.6907 4.16667 11.2503 3.60703 11.2503 2.91667M10.0003 4.16667C9.30997 4.16667 8.75033 3.60703 8.75033 2.91667M10.0003 11.6667V15.8333M10.0003 15.8333C9.30997 15.8333 8.75033 16.393 8.75033 17.0833M10.0003 15.8333C10.6907 15.8333 11.2503 16.393 11.2503 17.0833M4.16699 6.66667L8.33366 9.16667M11.667 10.8333L15.8337 13.3333M17.0837 7.5V12.0833M17.0837 7.5C17.774 7.5 18.3337 6.94036 18.3337 6.25C18.3337 5.55965 17.774 5.00001 17.0837 5.00001C16.3933 5.00001 15.8337 5.55965 15.8337 6.25C15.8337 6.94036 16.3933 7.5 17.0837 7.5ZM11.2503 17.0833L15.8337 14.5833M11.2503 17.0833C11.2503 17.7737 10.6907 18.3333 10.0003 18.3333C9.30997 18.3333 8.75033 17.7737 8.75033 17.0833M3.75033 14.5833L8.75033 17.0833M2.91699 12.5V7.5M2.91699 12.5C2.22664 12.5 1.66699 13.0596 1.66699 13.75C1.66699 14.4404 2.22664 15 2.91699 15C3.60735 15 4.16699 14.4404 4.16699 13.75C4.16699 13.0596 3.60735 12.5 2.91699 12.5ZM2.91699 7.5C3.60735 7.5 4.16699 6.94036 4.16699 6.25C4.16699 5.55965 3.60735 5.00001 2.91699 5.00001C2.22664 5.00001 1.66699 5.55965 1.66699 6.25C1.66699 6.94036 2.22664 7.5 2.91699 7.5ZM3.75033 5.41667L8.75033 2.91667M8.75033 2.91667C8.75033 2.22632 9.30997 1.66667 10.0003 1.66667C10.6907 1.66667 11.2503 2.22632 11.2503 2.91667M16.2503 5.41667L11.2503 2.91667M18.3337 13.75C18.3337 14.4404 17.774 15 17.0837 15C16.3933 15 15.8337 14.4404 15.8337 13.75C15.8337 13.0596 16.3933 12.5 17.0837 12.5C17.774 12.5 18.3337 13.0596 18.3337 13.75ZM10.0003 8.125L11.667 9.0625V10.9375L10.0003 11.875L8.33366 10.9375V9.0625L10.0003 8.125Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        </g>
+        <defs>
+            <clipPath id="clip0_10436_1186">
+                <rect width="20" height="20" fill="white" />
+            </clipPath>
+        </defs>
+    </svg>
+
+);

package/src/assets/icon/System/Network/NetworkSm.tsx

@@ -0,0 +1,16 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NetworkSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <g clip-path="url(#clip0_10436_1184)">
+            <path d="M3.33301 10.6667L6.66634 8.66666M9.33301 7.33333L12.6663 5.33333M7.99967 3.33333V6.66666M7.99967 3.33333C8.55196 3.33333 8.99967 2.88561 8.99967 2.33333M7.99967 3.33333C7.44739 3.33333 6.99967 2.88561 6.99967 2.33333M7.99967 9.33333V12.6667M7.99967 12.6667C7.44739 12.6667 6.99967 13.1144 6.99967 13.6667M7.99967 12.6667C8.55196 12.6667 8.99967 13.1144 8.99967 13.6667M3.33301 5.33333L6.66634 7.33333M9.33301 8.66666L12.6663 10.6667M13.6663 5.99999V9.66666M13.6663 5.99999C14.2186 5.99999 14.6663 5.55228 14.6663 4.99999C14.6663 4.44771 14.2186 3.99999 13.6663 3.99999C13.1141 3.99999 12.6663 4.44771 12.6663 4.99999C12.6663 5.55228 13.1141 5.99999 13.6663 5.99999ZM8.99967 13.6667L12.6663 11.6667M8.99967 13.6667C8.99967 14.2189 8.55196 14.6667 7.99967 14.6667C7.44739 14.6667 6.99967 14.2189 6.99967 13.6667M2.99967 11.6667L6.99967 13.6667M2.33301 9.99999V5.99999M2.33301 9.99999C1.78072 9.99999 1.33301 10.4477 1.33301 11C1.33301 11.5523 1.78072 12 2.33301 12C2.88529 12 3.33301 11.5523 3.33301 11C3.33301 10.4477 2.88529 9.99999 2.33301 9.99999ZM2.33301 5.99999C2.88529 5.99999 3.33301 5.55228 3.33301 4.99999C3.33301 4.44771 2.88529 3.99999 2.33301 3.99999C1.78072 3.99999 1.33301 4.44771 1.33301 4.99999C1.33301 5.55228 1.78072 5.99999 2.33301 5.99999ZM2.99967 4.33333L6.99967 2.33333M6.99967 2.33333C6.99967 1.78104 7.44739 1.33333 7.99967 1.33333C8.55196 1.33333 8.99967 1.78104 8.99967 2.33333M12.9997 4.33333L8.99967 2.33333M14.6663 11C14.6663 11.5523 14.2186 12 13.6663 12C13.1141 12 12.6663 11.5523 12.6663 11C12.6663 10.4477 13.1141 9.99999 13.6663 9.99999C14.2186 9.99999 14.6663 10.4477 14.6663 11ZM7.99967 6.49999L9.33301 7.24999V8.74999L7.99967 9.49999L6.66634 8.74999V7.24999L7.99967 6.49999Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        </g>
+        <defs>
+            <clipPath id="clip0_10436_1184">
+                <rect width="16" height="16" fill="white" />
+            </clipPath>
+        </defs>
+    </svg>
+
+);

package/src/assets/icon/System/Notification/NotificationLg.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NotificationLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M11 4H7.8C6.11984 4 5.27976 4 4.63803 4.32698C4.07354 4.6146 3.6146 5.07354 3.32698 5.63803C3 6.27976 3 7.11984 3 8.8V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21H15.2C16.8802 21 17.7202 21 18.362 20.673C18.9265 20.3854 19.3854 19.9265 19.673 19.362C20 18.7202 20 17.8802 20 16.2V13M20.1213 3.87868C21.2929 5.05025 21.2929 6.94975 20.1213 8.12132C18.9497 9.29289 17.0503 9.29289 15.8787 8.12132C14.7071 6.94975 14.7071 5.05025 15.8787 3.87868C17.0503 2.70711 18.9497 2.70711 20.1213 3.87868Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Notification/NotificationMd.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NotificationMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M9.16667 3.33333H6.5C5.09987 3.33333 4.3998 3.33333 3.86502 3.60582C3.39462 3.8455 3.01217 4.22795 2.77248 4.69836C2.5 5.23314 2.5 5.9332 2.5 7.33333V13.5C2.5 14.9001 2.5 15.6002 2.77248 16.135C3.01217 16.6054 3.39462 16.9878 3.86502 17.2275C4.3998 17.5 5.09987 17.5 6.5 17.5H12.6667C14.0668 17.5 14.7669 17.5 15.3016 17.2275C15.772 16.9878 16.1545 16.6054 16.3942 16.135C16.6667 15.6002 16.6667 14.9001 16.6667 13.5V10.8333M16.7678 3.23223C17.7441 4.20854 17.7441 5.79146 16.7678 6.76777C15.7915 7.74408 14.2085 7.74408 13.2322 6.76777C12.2559 5.79146 12.2559 4.20854 13.2322 3.23223C14.2085 2.25592 15.7915 2.25592 16.7678 3.23223Z" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Notification/NotificationSm.tsx

@@ -0,0 +1,9 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NotificationSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M7.33333 2.66667H5.2C4.0799 2.66667 3.51984 2.66667 3.09202 2.88465C2.71569 3.0764 2.40973 3.38236 2.21799 3.75869C2 4.18651 2 4.74656 2 5.86667V10.8C2 11.9201 2 12.4802 2.21799 12.908C2.40973 13.2843 2.71569 13.5903 3.09202 13.782C3.51984 14 4.07989 14 5.2 14H10.1333C11.2534 14 11.8135 14 12.2413 13.782C12.6176 13.5903 12.9236 13.2843 13.1153 12.908C13.3333 12.4802 13.3333 11.9201 13.3333 10.8V8.66667M13.4142 2.58579C14.1953 3.36683 14.1953 4.63317 13.4142 5.41421C12.6332 6.19526 11.3668 6.19526 10.5858 5.41421C9.80474 4.63317 9.80474 3.36683 10.5858 2.58579C11.3668 1.80474 12.6332 1.80474 13.4142 2.58579Z" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/NotificationTrue/NotificationtrueLg.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NotificationtrueLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M11 4H7.8C6.11984 4 5.27976 4 4.63803 4.32698C4.07354 4.6146 3.6146 5.07354 3.32698 5.63803C3 6.27976 3 7.11984 3 8.8V16.2C3 17.8802 3 18.7202 3.32698 19.362C3.6146 19.9265 4.07354 20.3854 4.63803 20.673C5.27976 21 6.11984 21 7.8 21H15.2C16.8802 21 17.7202 21 18.362 20.673C18.9265 20.3854 19.3854 19.9265 19.673 19.362C20 18.7202 20 17.8802 20 16.2V13" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M20.1213 3.87868C21.2929 5.05025 21.2929 6.94975 20.1213 8.12132C18.9497 9.29289 17.0503 9.29289 15.8787 8.12132C14.7071 6.94975 14.7071 5.05025 15.8787 3.87868C17.0503 2.70711 18.9497 2.70711 20.1213 3.87868Z" fill="#FF2244" stroke="#FF2244" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/NotificationTrue/NotificationtrueMd.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NotificationtrueMd = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M9.16667 3.33333H6.5C5.09987 3.33333 4.3998 3.33333 3.86502 3.60581C3.39462 3.8455 3.01217 4.22795 2.77248 4.69835C2.5 5.23313 2.5 5.9332 2.5 7.33333V13.5C2.5 14.9001 2.5 15.6002 2.77248 16.135C3.01217 16.6054 3.39462 16.9878 3.86502 17.2275C4.3998 17.5 5.09987 17.5 6.5 17.5H12.6667C14.0668 17.5 14.7669 17.5 15.3016 17.2275C15.772 16.9878 16.1545 16.6054 16.3942 16.135C16.6667 15.6002 16.6667 14.9001 16.6667 13.5V10.8333" stroke={color} strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M16.7678 3.23223C17.7441 4.20854 17.7441 5.79146 16.7678 6.76777C15.7915 7.74408 14.2085 7.74408 13.2322 6.76777C12.2559 5.79146 12.2559 4.20854 13.2322 3.23223C14.2085 2.25592 15.7915 2.25592 16.7678 3.23223Z" fill="#FF2244" stroke="#FF2244" strokeWidth="1.5" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/NotificationTrue/NotificationtrueSm.tsx

@@ -0,0 +1,10 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const NotificationtrueSm = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M7.33333 2.66667H5.2C4.0799 2.66667 3.51984 2.66667 3.09202 2.88466C2.71569 3.07641 2.40973 3.38237 2.21799 3.75869C2 4.18651 2 4.74657 2 5.86667V10.8C2 11.9201 2 12.4802 2.21799 12.908C2.40973 13.2843 2.71569 13.5903 3.09202 13.782C3.51984 14 4.07989 14 5.2 14H10.1333C11.2534 14 11.8135 14 12.2413 13.782C12.6176 13.5903 12.9236 13.2843 13.1153 12.908C13.3333 12.4802 13.3333 11.9201 13.3333 10.8V8.66667" stroke={color} strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M13.4142 2.58579C14.1953 3.36683 14.1953 4.63317 13.4142 5.41421C12.6332 6.19526 11.3668 6.19526 10.5858 5.41421C9.80474 4.63317 9.80474 3.36683 10.5858 2.58579C11.3668 1.80474 12.6332 1.80474 13.4142 2.58579Z" fill="#FF2244" stroke="#FF2244" strokeLinecap="round" strokeLinejoin="round" />
+    </svg>
+
+);

package/src/assets/icon/System/Passport/PassportLg.tsx

@@ -0,0 +1,14 @@
+// Generated from SVG to React Component
+import React, { SVGProps } from "react";
+
+export const PassportLg = ({ color = "black", ...props }: SVGProps<SVGSVGElement>) => (
+    <svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+        <path d="M10 17H12H14M8.8 22H15.2C16.8802 22 17.7202 22 18.362 21.673C18.9265 21.3854 19.3854 20.9265 19.673 20.362C20 19.7202 20 18.8802 20 17.2V6.8C20 5.11984 20 4.27976 19.673 3.63803C19.3854 3.07354 18.9265 2.6146 18.362 2.32698C17.7202 2 16.8802 2 15.2 2H8.8C7.11984 2 6.27976 2 5.63803 2.32698C5.07354 2.6146 4.6146 3.07354 4.32698 3.63803C4 4.27976 4 5.11984 4 6.8V17.2C4 18.8802 4 19.7202 4.32698 20.362C4.6146 20.9265 5.07354 21.3854 5.63803 21.673C6.27976 22 7.11984 22 8.8 22Z" stroke={color} strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" />
+        <path d="M12 12.9921C14.2091 12.9921 16 11.2012 16 8.9921C16 6.78296 14.2091 4.9921 12 4.9921C9.79086 4.9921 8 6.78296 8 8.9921C8 11.2012 9.79086 12.9921 12 12.9921Z" stroke={color} stroke-miterlimit="10" />
+        <path d="M11.9688 4.97699V13M11.0255 12.8724C11.0255 12.8724 8.03912 9.08987 11.0255 5.11183" stroke={color} stroke-miterlimit="10" />
+        <path d="M12 12.9921C14.2091 12.9921 16 11.2012 16 8.9921C16 6.78296 14.2091 4.9921 12 4.9921C9.79086 4.9921 8 6.78296 8 8.9921C8 11.2012 9.79086 12.9921 12 12.9921Z" stroke={color} stroke-miterlimit="10" />
+        <path d="M12.9746 12.8724C12.9746 12.8724 15.961 9.08992 12.9746 5.11188" stroke={color} stroke-miterlimit="10" />
+        <path d="M8.02539 8.54022C8.02539 8.54022 8.57811 10.0875 11.9999 10.0875C15.4217 10.0875 15.9744 8.54041 15.9744 8.54041" stroke={color} stroke-miterlimit="10" />
+    </svg>
+
+);