@blockspoon/cert-badge-renderer 1.0.1

package/src/templates/badges/BadgeType17.ts

@@ -0,0 +1,86 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType17({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  const paintId0 = `paint0_linear_${Math.random().toString(36).substr(2, 9)}`;
+
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 536 537"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        max-width: 100%;
+        max-height: 100%;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <path
+        d="M388.379 9.39297C382.376 3.37934 374.228 0 365.731 0H170.259C161.762 0 153.614 3.37961 147.611 9.39368L9.35149 147.911C3.36322 153.911 0 162.041 0 170.517V366.473C0 374.95 3.36296 383.08 9.3508 389.079L147.611 527.606C153.614 533.62 161.762 537 170.26 537H365.731C374.228 537 382.376 533.62 388.379 527.606L526.648 389.079C532.637 383.08 536 374.949 536 366.473V170.518C536 162.041 532.636 153.91 526.648 147.911L388.379 9.39297Z"
+        fill="url(#${paintId0})"
+      />
+      <path
+        d="M381.752 25.3943C375.749 19.3798 367.601 16 359.103 16H176.888C168.39 16 160.241 19.3801 154.238 25.395L25.3502 154.539C19.3627 160.538 16 168.668 16 177.144V359.847C16 368.323 19.3624 376.452 25.3495 382.452L154.238 511.604C160.241 517.62 168.39 521 176.889 521H359.103C367.601 521 375.75 517.62 381.752 511.605L510.65 382.452C516.637 376.453 520 368.323 520 359.847V177.145C520 168.668 516.637 160.538 510.649 154.539L381.752 25.3943Z"
+        fill="white"
+      />
+      <path
+        d="M376.782 37.3954C370.779 31.3803 362.63 28 354.132 28H181.86C173.361 28 165.212 31.3806 159.209 37.3961L37.3491 159.51C31.3623 165.509 28 173.638 28 182.114V354.878C28 363.353 31.362 371.482 37.3483 377.481L159.209 499.603C165.212 505.619 173.362 509 181.86 509H354.131C362.63 509 370.779 505.619 376.782 499.604L498.651 377.481C504.638 371.482 508 363.353 508 354.878V182.114C508 173.639 504.637 165.509 498.65 159.51L376.782 37.3954Z"
+        fill="${mainColor}"
+      />
+      <rect
+        x="41.0898"
+        y="187.426"
+        width="453.821"
+        height="193.574"
+        fill="url(#paint1_linear_2384_1397)"
+        fill-opacity="0.4"
+      />
+      <path
+        d="M354.132 33C361.302 33 368.178 35.8521 373.243 40.9274L495.111 163.042C500.163 168.104 503 174.963 503 182.114V354.878C503 362.029 500.163 368.888 495.112 373.95L373.243 496.072C368.178 501.148 361.302 504 354.131 504H181.86C174.69 504 167.813 501.147 162.748 496.071L40.8877 373.95C35.8367 368.888 33 362.029 33 354.878V182.114C33 174.963 35.8369 168.104 40.8883 163.042L162.748 40.928C167.813 35.8524 174.689 33 181.86 33H354.132Z"
+        stroke="black"
+        stroke-opacity="0.4"
+        stroke-width="10"
+      />
+      <path
+        d="M354.138 40.5C359.316 40.5 364.283 42.5601 367.941 46.226L489.803 168.346C493.451 172.001 495.5 176.955 495.5 182.12V354.872C495.5 360.037 493.451 364.99 489.804 368.646L367.941 490.774C364.283 494.44 359.316 496.5 354.137 496.5H181.855C176.676 496.5 171.709 494.44 168.051 490.773L46.196 368.646C42.5485 364.99 40.5 360.037 40.5 354.873V182.119C40.5 176.955 42.5486 172.001 46.1964 168.346L168.051 46.2264C171.709 42.5603 176.675 40.5 181.854 40.5H354.138Z"
+        stroke="white"
+        stroke-width="5"
+      />
+      <path
+        d="M56.0039 381L165.306 489.691C171.302 495.653 179.414 499 187.87 499H348.129C356.585 499 364.697 495.653 370.693 489.691L479.999 381H56.0039Z"
+        fill="white"
+      />
+      <defs>
+        <linearGradient
+          id="${paintId0}"
+          x1="268"
+          y1="0"
+          x2="268"
+          y2="537"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="${subColor}" />
+          <stop offset="1" stop-color="${mainColor}" />
+        </linearGradient>
+        <linearGradient
+          id="paint1_linear_2384_1397"
+          x1="268"
+          y1="253.865"
+          x2="268"
+          y2="381"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="white" />
+          <stop offset="1" stop-color="white" stop-opacity="0" />
+        </linearGradient>
+      </defs>
+    </svg>
+  `;
+} 

package/src/templates/badges/BadgeType18.ts

@@ -0,0 +1,52 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType18({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 460 462"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        max-width: 100%;
+        max-height: 100%;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <path
+        d="M410.277 0C437.661 0 460 20.0121 460 44.5431V255.854C460 369.471 356.71 462 229.88 462C103.29 462 0 369.686 0 255.854V44.5431C0 20.0121 22.3394 0 49.7232 0H410.277Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M398.52 13C424.118 13 445 31.8426 445 54.9399V253.901C445 360.878 348.447 448 229.888 448C111.554 448 15 361.081 15 253.901V54.9399C15 31.8426 35.8825 13 61.4804 13H398.52Z"
+        fill="white"
+      />
+      <path
+        d="M229.888 448.099C348.447 448.099 445 360.977 445 254H15C15 361.18 111.554 448.099 229.888 448.099Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M229.916 375C318.697 375 391 307.223 391 224H69C69 307.381 141.303 375 229.916 375Z"
+        fill="white"
+      />
+      <path
+        d="M389.114 27C412.371 27 431 44.1338 431 64.7224V253.164C431 353.197 340.923 435 229.894 435C119.077 435 29 353.389 29 253.164V64.7224C29 44.1338 47.6293 27 70.8862 27H389.114Z"
+        stroke="${mainColor}"
+        stroke-width="4"
+      />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M27.0021 254C27.501 355.128 118.471 437 229.894 437C341.527 437 432.498 354.938 432.998 254H445C445 360.977 348.447 448.099 229.888 448.099C111.554 448.099 15 361.18 15 254H27.0021Z"
+        fill="white"
+      />
+    </svg>
+  `;
+} 

package/src/templates/badges/BadgeType19.ts

@@ -0,0 +1,82 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType19({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 422 456"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        max-width: 100%;
+        max-height: 100%;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <path
+        d="M105.159 455.707C47.2422 455.707 0 412.883 0 360.177V95.617C0 43.1167 47.2422 0.292969 105.159 0.292969H316.841C374.758 0.292969 422 43.1167 422 95.617V360.177C422 412.677 374.758 455.501 316.841 455.501L105.159 455.707Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M114.69 437.634C61.9882 437.634 19 398.209 19 349.686V106.122C19 57.7887 61.9882 18.3636 114.69 18.3636H307.31C360.012 18.3636 403 57.7887 403 106.122V349.686C403 398.019 360.012 437.444 307.31 437.444L114.69 437.634Z"
+        fill="white"
+      />
+      <mask
+        id="mask0_2384_1403"
+        style="mask-type:alpha"
+        maskUnits="userSpaceOnUse"
+        x="19"
+        y="4"
+        width="384"
+        height="434"
+      >
+        <path
+          d="M114.688 437.633C61.9872 437.633 19 396.933 19 346.842V95.4045C19 45.5084 61.9872 4.80884 114.688 4.80884H307.304C360.005 4.80884 402.992 45.5084 402.992 95.4045V346.842C403.683 398.778 360.696 437.437 307.304 437.437L114.688 437.633Z"
+          fill="white"
+        />
+      </mask>
+      <g mask="url(#mask0_2384_1403)">
+        <path
+          d="M48.4609 364.687C51.4283 364.149 54.4677 364.61 57.0205 365.984L74.4369 375.362C76.0508 376.231 75.5859 378.516 73.7175 378.897L64.1164 380.856C61.1434 381.463 58.0721 381.062 55.473 379.727L36.9355 370.207C35.2635 369.349 35.7484 366.992 37.6689 366.644L48.4609 364.687Z"
+          fill="${subColor}"
+        />
+        <path
+          d="M227.862 374.051C231.559 373.348 235.345 373.829 238.601 375.415L318.515 414.342C320.498 415.308 321.196 417.628 320.075 419.529L288.031 473.886C286.91 475.788 284.393 476.55 282.406 475.591L126.503 400.292C123.089 398.643 124.014 393.795 127.884 393.059L227.862 374.051Z"
+          fill="${subColor}"
+        />
+        <path
+          d="M298.565 396.583C303.252 395.444 308.14 395.853 312.39 397.739L418.61 444.888C420.627 445.783 421.415 448.075 420.373 450.012L402.505 483.22C401.438 485.204 398.872 486.043 396.837 485.075L250.137 415.287C246.799 413.7 247.546 408.984 251.278 408.077L298.565 396.583Z"
+          fill="${mainColor}"
+        />
+        <path
+          d="M199.746 414.085C204.4 412.957 209.253 413.356 213.483 415.214L329.189 466.038C331.216 466.929 332.011 469.226 330.966 471.169L313.085 504.401C312.026 506.37 309.487 507.214 307.455 506.273L149.634 433.186C146.258 431.623 146.986 426.868 150.741 425.958L199.746 414.085Z"
+          fill="${mainColor}"
+        />
+        <path
+          d="M76.6085 363.581C79.553 362.947 82.6031 363.311 85.1984 364.604L122.178 383.028C125.525 384.695 124.639 389.407 120.833 390.181L105.633 393.272C102.777 393.853 99.831 393.499 97.3047 392.273L59.8349 374.079C56.472 372.446 57.2997 367.734 61.0927 366.918L76.6085 363.581Z"
+          fill="${mainColor}"
+        />
+        <path
+          d="M310.262 362.262C313.047 361.465 315.991 361.602 318.586 362.65L376.685 386.112C379.84 387.386 379.8 391.648 376.619 393.161L356.179 402.885C351.443 405.138 345.968 405.183 341.419 403.006L285.54 376.268C282.287 374.712 282.915 370.091 286.521 369.059L310.262 362.262Z"
+          fill="${subColor}"
+        />
+        <path
+          d="M385.778 366.569C386.655 366.271 387.596 366.26 388.452 366.536L440.862 383.455C443.875 384.428 444.41 388.256 441.805 390.201L429.975 399.038C428.763 399.943 427.161 400.163 425.804 399.611L372.826 378.062C369.455 376.69 369.813 371.986 373.381 370.775L385.778 366.569Z"
+          fill="${subColor}"
+        />
+      </g>
+      <path
+        d="M304.299 430.125H304.3C354.885 430.125 396 392.259 396 346.014V109.8C396 63.5557 354.885 25.6892 304.3 25.6892H117.7C67.1149 25.6892 26 63.5557 26 109.8V346.014C26 392.443 67.1159 430.308 117.699 430.309L304.299 430.125ZM304.299 430.125L117.7 430.309L304.299 430.125Z"
+        stroke="${mainColor}"
+        stroke-width="2"
+      />
+    </svg>
+  `;
+} 

package/src/templates/badges/BadgeType2.ts

@@ -0,0 +1,50 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType2({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 478 489"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        width: 100%;
+        height: 100%;
+        object-fit: contain;
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+        max-width: 100%;
+        max-height: 100%;
+        z-index: 1;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <path
+        d="M444.148 378.396L274.839 479.153C252.771 492.282 225.212 492.282 203.161 479.153L33.8515 378.396C12.8468 365.891 0 343.387 0 319.084V69.1547C0 30.9622 31.202 0 69.6902 0H408.31C446.798 0 478 30.9622 478 69.1547V319.084C478 343.387 465.153 365.891 444.148 378.396Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M432.99 376.182L272.889 470.758C252.022 483.081 225.962 483.081 205.111 470.758L45.0102 376.182C25.1481 364.443 13 343.32 13 320.508V85.9121C13 50.0627 42.5048 21 78.8995 21H399.101C435.495 21 465 50.0627 465 85.9121V320.508C465 343.32 452.852 364.443 432.99 376.182Z"
+        fill="#101113"
+        fill-opacity="0.4"
+      />
+      <path
+        d="M426.981 366.896L271.84 458.999C251.618 471 226.366 471 206.16 458.999L51.0187 366.896C31.7718 355.464 20 334.893 20 312.678V84.2151C20 49.3029 48.5909 21 83.8584 21H394.142C429.409 21 458 49.3029 458 84.2151V312.678C458 334.893 446.228 355.464 426.981 366.896Z"
+        fill="${subColor}"
+      />
+      <path
+        d="M417.539 360.872L270.19 448.442C250.985 459.853 227 459.853 207.81 448.442L60.4607 360.872C42.1805 350.003 31 330.444 31 309.322V92.1038C31 58.9099 58.1548 32 91.6509 32H386.349C419.845 32 447 58.9099 447 92.1038V309.322C447 330.444 435.819 350.003 417.539 360.872Z"
+        fill="white"
+      />
+    </svg>
+  `;
+} 

package/src/templates/badges/BadgeType20.ts

@@ -0,0 +1,100 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType20({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  const paintId0 = `paint0_linear_${Math.random().toString(36).substr(2, 9)}`;
+  const paintId1 = `paint1_linear_${Math.random().toString(36).substr(2, 9)}`;
+
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 536 536"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        max-width: 100%;
+        max-height: 100%;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <circle
+        cx="268"
+        cy="268"
+        r="268"
+        fill="url(#${paintId0})"
+      />
+      <circle cx="268" cy="268" r="248" fill="${mainColor}" />
+      <circle
+        cx="268"
+        cy="268"
+        r="245.5"
+        stroke="black"
+        stroke-opacity="0.5"
+        stroke-width="5"
+      />
+      <ellipse
+        cx="268"
+        cy="279"
+        rx="216"
+        ry="211"
+        fill="black"
+        fill-opacity="0.3"
+      />
+      <circle
+        cx="268"
+        cy="268"
+        r="209"
+        fill="url(#${paintId1})"
+      />
+      <circle cx="268" cy="267" r="199" stroke="white" stroke-width="2" />
+      <path
+        fill-rule="evenodd"
+        clip-rule="evenodd"
+        d="M75.8994 185H460.102C470.978 211.204 477.001 240.078 477.001 270.409C477.001 290.661 474.316 310.264 469.294 328.855H66.7077C61.6855 310.264 59 290.661 59 270.409C59 240.078 65.0236 211.204 75.8994 185Z"
+        fill="url(#paint2_linear_2384_1404)"
+        fill-opacity="0.3"
+      />
+      <defs>
+        <linearGradient
+          id="${paintId0}"
+          x1="268"
+          y1="0"
+          x2="268"
+          y2="536"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="${mainColor}" />
+          <stop offset="1" stop-color="${subColor}" />
+        </linearGradient>
+        <linearGradient
+          id="${paintId1}"
+          x1="268"
+          y1="59"
+          x2="268"
+          y2="477"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="${subColor}" />
+          <stop offset="1" stop-color="${mainColor}" />
+        </linearGradient>
+        <linearGradient
+          id="paint2_linear_2384_1404"
+          x1="268.001"
+          y1="215.822"
+          x2="268.001"
+          y2="376.6"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="white" />
+          <stop offset="1" stop-color="white" />
+        </linearGradient>
+      </defs>
+    </svg>
+  `;
+} 

package/src/templates/badges/BadgeType21.ts

@@ -0,0 +1,66 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType21({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  const paintId0 = `paint0_linear_${Math.random().toString(36).substr(2, 9)}`;
+
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 421 488"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        max-width: 100%;
+        max-height: 100%;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <path
+        d="M420.496 355.131C420.496 366.872 414.066 377.67 403.744 383.264L225.744 479.736C216.232 484.891 204.76 484.891 195.248 479.736L17.2483 383.264C6.92587 377.67 0.496094 366.872 0.496094 355.131V97.5405C0.496094 86.5242 6.07967 76.2255 15.2035 70.0518C51.467 45.5138 122.373 -1.30827 216.238 0.0279996C304.115 1.29475 370.438 45.9556 405.8 70.0342C414.905 76.2336 420.496 86.523 420.496 97.5378V355.131Z"
+        fill="url(#${paintId0})"
+      />
+      <path
+        d="M404.496 346.698C404.496 358.384 398.126 369.14 387.879 374.758L225.879 463.567C216.296 468.82 204.696 468.82 195.113 463.567L33.1134 374.758C22.8662 369.14 16.4961 358.384 16.4961 346.698V108.198C16.4961 97.2402 22.0174 86.9719 31.0631 80.7877C64.8515 57.6879 129.925 14.7896 215.801 16.0262C296.178 17.1981 357.035 58.1185 389.94 80.7669C398.965 86.9787 404.496 97.2389 404.496 108.195V346.698Z"
+        fill="white"
+      />
+      <path
+        d="M400.496 344.592C400.496 356.263 394.142 367.008 383.916 372.632L225.916 459.52C216.314 464.801 204.678 464.801 195.076 459.52L37.0763 372.632C26.8498 367.008 20.4961 356.263 20.4961 344.592V110.859C20.4961 99.918 26.0031 89.6562 35.0275 83.4695C68.1938 60.7325 131.81 18.8141 215.691 20.0257C294.196 21.1739 353.688 61.1603 385.975 83.4479C394.979 89.6628 400.496 99.9167 400.496 110.857V344.592Z"
+        fill="${subColor}"
+      />
+      <path
+        d="M377.301 367.188L225.301 449.814C216.069 454.832 204.923 454.832 195.691 449.814L43.6909 367.188C33.7099 361.763 27.4961 351.313 27.4961 339.952V267C27.4961 249.879 41.3753 236 58.4961 236H362.496C379.617 236 393.496 249.879 393.496 267V339.952C393.496 351.313 387.282 361.763 377.301 367.188Z"
+        stroke="white"
+        stroke-width="2"
+      />
+      <path
+        d="M21.4961 110.835V190C21.4961 207.673 35.823 222 53.4961 222H368.496C386.169 222 400.496 207.673 400.496 190V110.832C400.496 99.9054 394.992 89.6622 386.008 83.444C353.804 61.1556 294.471 21.1739 216.178 20.0257C132.522 18.8141 69.0756 60.7277 35.9951 83.4655C26.9894 89.6556 21.4961 99.9067 21.4961 110.835Z"
+        fill="white"
+      />
+      <path
+        d="M23.9961 110.81V190C23.9961 206.292 37.2037 219.5 53.4961 219.5H367.496C383.789 219.5 396.996 206.292 396.996 190V110.807C396.996 100.735 391.925 91.2606 383.615 85.494C351.516 63.2195 292.89 23.6616 215.628 22.5254L23.9961 110.81ZM23.9961 110.81C23.9961 100.733 29.0583 91.2559 37.3811 85.5201C70.3373 62.808 133.044 21.3264 215.627 22.5254L23.9961 110.81Z"
+        stroke="${mainColor}"
+        stroke-width="5"
+      />
+      <defs>
+        <linearGradient
+          id="${paintId0}"
+          x1="210.496"
+          y1="0"
+          x2="210.496"
+          y2="488"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="${mainColor}" />
+          <stop offset="1" stop-color="${subColor}" />
+        </linearGradient>
+      </defs>
+    </svg>
+  `;
+} 

package/src/templates/badges/BadgeType22.ts

@@ -0,0 +1,61 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType22({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  const paintId0 = `paint0_linear_${Math.random().toString(36).substr(2, 9)}`;
+
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 475 528"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        max-width: 100%;
+        max-height: 100%;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <path
+        d="M443.999 109.676L268.038 8.17027C249.152 -2.72343 225.876 -2.72343 206.99 8.17027L31.0112 109.676C12.1252 120.569 0.496094 140.707 0.496094 162.495V365.505C0.496094 387.293 12.1252 407.431 31.0112 418.324L206.972 519.83C225.858 530.723 249.134 530.723 268.02 519.83L443.981 418.324C462.867 407.431 474.496 387.293 474.496 365.505V162.495C474.496 140.707 462.867 120.569 443.981 109.676H443.999Z"
+        fill="url(#${paintId0})"
+      />
+      <path
+        d="M427.444 120.782L265.59 26.5823C248.218 16.4726 226.808 16.4726 209.436 26.5823L47.5648 120.782C30.1929 130.892 19.4961 149.581 19.4961 169.8V358.2C19.4961 378.419 30.1929 397.108 47.5648 407.218L209.419 501.418C226.791 511.527 248.201 511.527 265.573 501.418L427.427 407.218C444.799 397.108 455.496 378.419 455.496 358.2V169.8C455.496 149.581 444.799 130.892 427.427 120.782H427.444Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M264.081 29.1752L416.325 117.782H416.308L425.918 123.375C442.36 132.943 452.496 150.64 452.496 169.8V358.2C452.496 377.36 442.36 395.057 425.918 404.625L427.427 407.218L425.918 404.625L264.064 498.825C247.625 508.392 227.367 508.392 210.928 498.825L49.0739 404.625L47.5648 407.218L49.0738 404.625C32.6325 395.057 22.4961 377.36 22.4961 358.2V169.8C22.4961 150.64 32.6325 132.943 49.0738 123.375L210.945 29.1752C227.384 19.6083 247.642 19.6083 264.081 29.1751C264.081 29.1751 264.081 29.1751 264.081 29.1752Z"
+        stroke="black"
+        stroke-opacity="0.4"
+        stroke-width="6"
+      />
+      <path
+        d="M263.141 45.1034L410.889 133.354H410.874C426.732 142.825 436.496 160.334 436.496 179.276L436.496 233H38.4961L38.4961 179.276C38.4961 160.334 48.2606 142.825 64.1185 133.354L211.881 45.1034C227.739 35.6322 247.283 35.6322 263.141 45.1034Z"
+        fill="white"
+      />
+      <rect x="0.496094" y="192" width="455" height="150" fill="white" />
+      <defs>
+        <linearGradient
+          id="${paintId0}"
+          x1="52.2609"
+          y1="99.025"
+          x2="333.374"
+          y2="485.163"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="${subColor}" />
+          <stop offset="0.4" stop-color="${subColor}" stop-opacity="0" />
+          <stop offset="0.695" stop-color="${subColor}" stop-opacity="0" />
+          <stop offset="1" stop-color="${subColor}" />
+        </linearGradient>
+      </defs>
+    </svg>
+  `;
+} 

package/src/templates/badges/BadgeType23.ts

@@ -0,0 +1,58 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType23({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  const paintId0 = `paint0_linear_${Math.random().toString(36).substr(2, 9)}`;
+
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 513 494"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        max-width: 100%;
+        max-height: 100%;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <path
+        d="M241.774 489.841C250.639 495.283 262.083 495.391 271.064 490.128C304.456 470.569 341.02 444.245 375.561 408.827C496.838 284.47 511.62 131.691 512.494 62.9683C512.627 52.3568 505.528 42.8212 494.799 39.1835C440.091 20.6386 356.801 -0.328906 253.86 0.00391159C153.557 0.336729 72.2311 20.7702 18.1803 39.0596C7.26028 42.7516 0.135638 52.5581 0.510182 63.363C2.96552 135.066 21.4596 286.436 142.595 410.855C175.33 444.478 209.772 470.182 241.774 489.841Z"
+        fill="url(#${paintId0})"
+      />
+      <path
+        d="M268.031 484.95L268.03 484.951C260.956 489.097 251.885 489.007 244.913 484.728C213.261 465.283 179.227 439.879 146.894 406.67C27.2827 283.816 8.941 134.247 6.50667 63.1577L6.50658 63.1552C6.23182 55.2289 11.4668 47.6631 20.102 44.7436L20.1034 44.7431C73.7101 26.6039 154.381 6.33403 253.879 6.00388C355.994 5.67373 438.614 26.4733 492.872 44.8657C501.369 47.7466 506.592 55.1142 506.495 62.893C505.628 131.018 490.954 281.91 371.266 404.638C337.165 439.605 301.049 465.611 268.031 484.95Z"
+        stroke="black"
+        stroke-opacity="0.4"
+        stroke-width="12"
+      />
+      <path
+        d="M243.73 458.38C251.416 463.116 261.341 463.211 269.129 458.629C298.086 441.605 329.794 418.691 359.748 387.862C464.918 279.615 477.737 146.63 478.495 86.8105C478.61 77.5738 472.453 69.2736 463.15 66.1071C415.707 49.9648 343.479 31.7137 254.21 32.0034C167.229 32.2931 96.7038 50.0793 49.8316 65.9993C40.3619 69.2129 34.1835 77.7489 34.5083 87.1541C36.6376 149.567 52.6754 281.327 157.723 389.627C186.11 418.893 215.977 441.268 243.73 458.38Z"
+        fill="white"
+      />
+      <path
+        d="M417.495 136.172C416.945 181.107 407.649 225.362 331.377 306.674L184.863 308C108.68 226.647 97.0491 183.314 95.505 136.43C95.2694 129.366 99.7501 122.953 106.618 120.539C140.611 108.581 191.757 95.2202 254.838 95.0026C319.578 94.7849 371.96 108.495 406.366 120.62C413.114 122.999 417.579 129.234 417.495 136.172Z"
+        fill="#FA2E43"
+      />
+      <defs>
+        <linearGradient
+          id="${paintId0}"
+          x1="256.496"
+          y1="0"
+          x2="256.496"
+          y2="494"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="${mainColor}" />
+          <stop offset="1" stop-color="${subColor}" />
+        </linearGradient>
+      </defs>
+    </svg>
+  `;
+} 

package/src/templates/badges/BadgeType24.ts

@@ -0,0 +1,62 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType24({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  const paintId0 = `paint0_linear_${Math.random().toString(36).substr(2, 9)}`;
+
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 475 474"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      preserveAspectRatio="xMidYMid meet"
+      style="
+        max-width: 100%;
+        max-height: 100%;
+        mix-blend-mode: normal;
+        pointer-events: none;
+        display: block;
+      "
+    >
+      <circle
+        cx="237.496"
+        cy="237"
+        r="237"
+        fill="url(#${paintId0})"
+      />
+      <circle cx="237.496" cy="237" r="214" fill="${subColor}" />
+      <circle
+        cx="237.496"
+        cy="237"
+        r="215.5"
+        stroke="black"
+        stroke-opacity="0.2"
+        stroke-width="3"
+      />
+      <circle cx="237.496" cy="237" r="199" fill="white" />
+      <path
+        d="M237.496 436C347.401 436 436.496 346.905 436.496 237H38.4961C38.4961 346.905 127.591 436 237.496 436Z"
+        fill="${mainColor}"
+      />
+      <defs>
+        <linearGradient
+          id="${paintId0}"
+          x1="52.2609"
+          y1="88.8975"
+          x2="295.143"
+          y2="460.529"
+          gradientUnits="userSpaceOnUse"
+        >
+          <stop stop-color="${subColor}" />
+          <stop offset="0.325" stop-color="${subColor}" stop-opacity="0" />
+          <stop offset="0.515" stop-color="${subColor}" stop-opacity="0" />
+          <stop offset="1" stop-color="${subColor}" />
+        </linearGradient>
+      </defs>
+    </svg>
+  `;
+}