@blockspoon/cert-badge-renderer 1.0.1

package/src/templates/badges/BadgeType40.ts

@@ -0,0 +1,124 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType40({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 520 544"
+      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;
+      "
+    >
+      <g filter="url(#filter0_d_2407_342)">
+        <path
+          d="M508 284C508 420.967 396.967 532 260 532C123.033 532 12 420.967 12 284L12 68C12 37.0721 37.0721 12 68 12L452 12.0001C482.928 12.0001 508 37.0721 508 68.0001L508 284Z"
+          fill="${mainColor}"
+        />
+      </g>
+      <path
+        d="M260 506C382.607 506 482 406.607 482 284L482 84C482 58.5949 461.405 38 436 38L84 38C58.5949 38 38 58.5949 38 84L38 284C38 406.607 137.393 506 260 506Z"
+        stroke="white"
+        stroke-width="12"
+      />
+      <path
+        d="M260 514C387.025 514 490 411.025 490 284L490 84C490 54.1766 465.823 30 436 30L84 30C54.1766 30 30 54.1766 30 84L30 284C30 411.025 132.974 514 260 514Z"
+        stroke="#101113"
+        stroke-opacity="0.5"
+        stroke-width="4"
+      />
+      <path
+        d="M479.867 284.215C479.867 405.645 381.428 504.084 259.998 504.084C138.568 504.084 40.129 405.645 40.129 284.215L40.129 79.9159C40.129 57.8245 58.0376 39.9159 80.129 39.9159L439.867 39.9159C461.959 39.9159 479.867 57.8246 479.867 79.9159L479.867 284.215Z"
+        fill="#101113"
+      />
+      <path
+        d="M179.007 67.6569C179.007 68.2091 241.516 68.6569 243.232 68.6569C244.948 68.6569 246.34 68.2091 246.34 67.6569C246.34 67.1046 244.948 66.6569 243.232 66.6569C241.516 66.6569 179.007 67.1046 179.007 67.6569Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M258.423 64.0017C259.224 62.9825 260.768 62.9825 261.569 64.0017L263.47 66.4212C264.04 67.1465 264.04 68.1673 263.47 68.8925L261.569 71.312C260.768 72.3312 259.224 72.3312 258.423 71.312L256.522 68.8925C255.953 68.1673 255.953 67.1465 256.522 66.4213L258.423 64.0017Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M340.99 67.6569C340.99 68.2091 278.48 68.6569 276.764 68.6569C275.048 68.6569 273.656 68.2091 273.656 67.6569C273.656 67.1046 275.048 66.6569 276.764 66.6569C278.48 66.6569 340.99 67.1046 340.99 67.6569Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M450.406 285.594C450.406 390.752 365.159 476 260 476C154.842 476 69.5938 390.752 69.5939 285.594L69.5939 248.091C69.5939 236.995 78.5889 228 89.6848 228L430.315 228C441.411 228 450.406 236.995 450.406 248.091L450.406 285.594Z"
+        fill="${mainColor}"
+        stroke="${subColor}"
+        stroke-width="6"
+      />
+      <mask
+        id="mask0_2407_342"
+        style="mask-type:alpha"
+        maskUnits="userSpaceOnUse"
+        x="66"
+        y="225"
+        width="388"
+        height="254"
+      >
+        <path
+          d="M453.406 285.594C453.406 392.409 366.815 479 260 479C153.185 479 66.5938 392.409 66.5939 285.594L66.5939 248.091C66.5939 235.338 76.932 225 89.6848 225L430.315 225C443.068 225 453.406 235.338 453.406 248.091L453.406 285.594Z"
+          fill="${mainColor}"
+        />
+      </mask>
+      <g mask="url(#mask0_2407_342)">
+        <ellipse
+          cx="260.823"
+          cy="475.656"
+          rx="268.144"
+          ry="152.656"
+          fill="${subColor}"
+        />
+      </g>
+      <defs>
+        <filter
+          id="filter0_d_2407_342"
+          x="0"
+          y="0"
+          width="520"
+          height="544"
+          filterUnits="userSpaceOnUse"
+          color-interpolation-filters="sRGB"
+        >
+          <feFlood flood-opacity="0" result="BackgroundImageFix" />
+          <feColorMatrix
+            in="SourceAlpha"
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+            result="hardAlpha"
+          />
+          <feOffset />
+          <feGaussianBlur stdDeviation="6" />
+          <feComposite in2="hardAlpha" operator="out" />
+          <feColorMatrix
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"
+          />
+          <feBlend
+            mode="normal"
+            in2="BackgroundImageFix"
+            result="effect1_dropShadow_2407_342"
+          />
+          <feBlend
+            mode="normal"
+            in="SourceGraphic"
+            in2="effect1_dropShadow_2407_342"
+            result="shape"
+          />
+        </filter>
+      </defs>
+    </svg>
+  `;
+}

package/src/templates/badges/BadgeType41.ts

@@ -0,0 +1,66 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType41({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 544 518"
+      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="M290.831 13.693C279.609 5.52994 264.405 5.52974 253.183 13.6925L18.7834 184.194C7.5811 192.342 2.8937 206.773 7.16963 219.949L96.7151 495.878C100.996 509.068 113.285 518 127.152 518H416.848C430.715 518 443.004 509.068 447.285 495.878L536.831 219.949C541.106 206.773 536.419 192.342 525.217 184.193L290.831 13.693Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M290.802 25.6405C279.592 17.5052 264.421 17.505 253.211 25.6401L30.8338 187.022C19.6055 195.17 14.9068 209.626 19.1982 222.819L104.122 483.898C108.409 497.078 120.693 506 134.552 506H409.448C423.307 506 435.591 497.078 439.878 483.898L524.802 222.818C529.093 209.625 524.395 195.17 513.167 187.021L290.802 25.6405Z"
+        fill="${subColor}"
+      />
+      <path
+        d="M290.629 45.3281C279.493 37.3581 264.519 37.3579 253.383 45.3276L52.2339 189.278C40.803 197.458 36.0488 212.14 40.5152 225.468L82.9733 352.168C87.3439 365.21 99.56 374 113.315 374H430.685C444.44 374 456.656 365.21 461.027 352.168L503.485 225.468C507.951 212.14 503.197 197.458 491.767 189.278L290.629 45.3281Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M254.139 51.8254C264.852 44.2694 279.16 44.2696 289.873 51.8258L485.867 190.064C497.1 197.987 501.774 212.362 497.349 225.377L456.34 345.98C452.067 358.548 440.265 367 426.991 367H117.009C103.735 367 91.9332 358.548 87.6597 345.98L46.6513 225.377C42.2258 212.362 46.9001 197.987 58.1339 190.064L254.139 51.8254Z"
+        stroke="${subColor}"
+        stroke-width="2"
+      />
+      <mask
+        id="mask0_2409_141"
+        style="mask-type:alpha"
+        maskUnits="userSpaceOnUse"
+        x="80"
+        y="167"
+        width="384"
+        height="207"
+      >
+        <path
+          d="M80 191C80 177.745 90.7452 167 104 167H440C453.255 167 464 177.745 464 191V340C464 358.778 448.778 374 430 374H114C95.2223 374 80 358.778 80 340V191Z"
+          fill="#5890CB"
+        />
+      </mask>
+      <g mask="url(#mask0_2409_141)">
+        <ellipse
+          cx="272.5"
+          cy="354"
+          rx="196.5"
+          ry="91"
+          fill="${subColor}"
+          fill-opacity="0.1"
+        />
+      </g>
+    </svg>
+  `;
+}

package/src/templates/badges/BadgeType42.ts

@@ -0,0 +1,110 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType42({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 553 565"
+      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;
+      "
+    >
+      <g filter="url(#filter0_d_2407_404)">
+        <path
+          d="M266.395 17.8386C271.349 11.3671 281.097 11.3671 286.051 17.8386L504.581 303.31C510.867 311.523 510.101 323.122 502.787 330.436L284.975 548.248C280.141 553.082 272.304 553.082 267.471 548.248L49.6583 330.436C42.3447 323.122 41.5778 311.523 47.8648 303.31L266.395 17.8386Z"
+          fill="white"
+        />
+      </g>
+      <path
+        d="M266.395 48.5847C271.349 42.1131 281.097 42.1131 286.051 48.5847L481.409 303.787C487.696 312 486.929 323.599 479.616 330.913L284.975 525.554C280.141 530.387 272.304 530.387 267.471 525.554L72.8295 330.913C65.5159 323.599 64.749 312 71.036 303.787L266.395 48.5847Z"
+        fill="${mainColor}"
+      />
+      <mask
+        id="mask0_2407_404"
+        style="mask-type:alpha"
+        maskUnits="userSpaceOnUse"
+        x="66"
+        y="43"
+        width="420"
+        height="487"
+      >
+        <path
+          d="M266.395 48.5847C271.349 42.1131 281.097 42.1131 286.051 48.5847L481.409 303.787C487.696 312 486.929 323.599 479.616 330.913L284.975 525.554C280.141 530.387 272.304 530.387 267.471 525.554L72.8295 330.913C65.5159 323.599 64.749 312 71.036 303.787L266.395 48.5847Z"
+          fill="${mainColor}"
+        />
+      </mask>
+      <g mask="url(#mask0_2407_404)">
+        <rect
+          x="48"
+          y="263"
+          width="465"
+          height="112"
+          fill="white"
+          fill-opacity="0.3"
+        />
+      </g>
+      <path
+        d="M270.669 61.249C273.469 57.5878 278.982 57.5854 281.786 61.2442L467.133 303.152C472.815 310.568 472.125 321.047 465.518 327.653L284.338 508.834C280.285 512.886 273.715 512.886 269.662 508.834L87.7966 326.968C81.1943 320.366 80.4998 309.896 86.1721 302.479L270.669 61.249Z"
+        stroke="${subColor}"
+        stroke-width="4"
+      />
+      <path
+        d="M267.586 59.7504C271.939 54.0631 280.506 54.0631 284.86 59.7504L471.324 303.335C477.154 310.95 476.443 321.706 469.661 328.488L283.914 514.235C279.666 518.483 272.779 518.483 268.531 514.235L82.784 328.488C76.0022 321.706 75.2911 310.95 81.1209 303.335L267.586 59.7504Z"
+        stroke="white"
+        stroke-width="3"
+      />
+      <path
+        d="M405.338 418.082H154.703L265.065 534.632L278.989 540.305L405.338 418.082Z"
+        fill="white"
+      />
+      <defs>
+        <filter
+          id="filter0_d_2407_404"
+          x="31.2402"
+          y="0.607968"
+          width="489.965"
+          height="563.642"
+          filterUnits="userSpaceOnUse"
+          color-interpolation-filters="sRGB"
+        >
+          <feFlood flood-opacity="0" result="BackgroundImageFix" />
+          <feColorMatrix
+            in="SourceAlpha"
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+            result="hardAlpha"
+          />
+          <feOffset />
+          <feGaussianBlur stdDeviation="6.18851" />
+          <feComposite in2="hardAlpha" operator="out" />
+          <feColorMatrix
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"
+          />
+          <feBlend
+            mode="normal"
+            in2="BackgroundImageFix"
+            result="effect1_dropShadow_2407_404"
+          />
+          <feBlend
+            mode="normal"
+            in="SourceGraphic"
+            in2="effect1_dropShadow_2407_404"
+            result="shape"
+          />
+        </filter>
+      </defs>
+    </svg>
+  `;
+}

package/src/templates/badges/BadgeType43.ts

@@ -0,0 +1,84 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType43({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 520 544"
+      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;
+      "
+    >
+      <g filter="url(#filter0_d_2407_406)">
+        <path
+          d="M508 284C508 420.967 396.967 532 260 532C123.033 532 12 420.967 12 284L12 52C12 29.9086 29.9086 12 52 12L468 12.0001C490.091 12.0001 508 29.9087 508 52.0001L508 284Z"
+          fill="#1E1C21"
+        />
+      </g>
+      <path
+        d="M488 284C488 409.921 385.921 512 260 512C134.079 512 32 409.921 32 284L32 72C32 49.9086 49.9086 32 72 32L448 32C470.091 32 488 49.9086 488 72L488 284Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M478 284C478 404.398 380.398 502 260 502C139.602 502 42 404.398 42 284L42 80C42 59.0132 59.0132 42 80 42L440 42C460.987 42 478 59.0132 478 80L478 284Z"
+        stroke="#1E1C21"
+        stroke-width="4"
+      />
+      <path
+        d="M476 121L44 121L44 80C44 60.1177 60.1177 44 80 44L440 44C459.882 44 476 60.1178 476 80L476 121Z"
+        fill="${subColor}"
+      />
+      <rect x="44" y="121" width="432" height="161" fill="#101113" />
+      <path d="M44 133L476 133" stroke="${mainColor}" stroke-width="5" />
+      <path d="M44 270L476 270" stroke="${mainColor}" stroke-width="5" />
+      <defs>
+        <filter
+          id="filter0_d_2407_406"
+          x="0"
+          y="0"
+          width="520"
+          height="544"
+          filterUnits="userSpaceOnUse"
+          color-interpolation-filters="sRGB"
+        >
+          <feFlood flood-opacity="0" result="BackgroundImageFix" />
+          <feColorMatrix
+            in="SourceAlpha"
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+            result="hardAlpha"
+          />
+          <feOffset />
+          <feGaussianBlur stdDeviation="6" />
+          <feComposite in2="hardAlpha" operator="out" />
+          <feColorMatrix
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"
+          />
+          <feBlend
+            mode="normal"
+            in2="BackgroundImageFix"
+            result="effect1_dropShadow_2407_406"
+          />
+          <feBlend
+            mode="normal"
+            in="SourceGraphic"
+            in2="effect1_dropShadow_2407_406"
+            result="shape"
+          />
+        </filter>
+      </defs>
+    </svg>
+  `;
+}

package/src/templates/badges/BadgeType44.ts

@@ -0,0 +1,45 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType44({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 509 509"
+      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="M0 254.289C0 247.017 3.94676 240.319 10.3074 236.795L95.511 189.588C101.872 186.064 105.818 179.366 105.818 172.094V99.368C105.818 92.2874 109.562 85.7345 115.662 82.1388L244.519 6.17858C250.957 2.3831 258.975 2.49431 265.306 6.46692L385.775 82.062C391.605 85.7205 395.145 92.1199 395.145 99.0029V171.68C395.145 179.17 399.33 186.033 405.989 189.462L498.156 236.921C504.815 240.35 509 247.212 509 254.702V489C509 500.046 500.046 509 489 509H20C8.95432 509 0 500.046 0 489V254.289Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M24 264.951C24 258.463 27.4912 252.478 33.1382 249.284L117.125 201.779C124.027 197.875 128.294 190.559 128.294 182.63V110.388C128.294 104.059 131.618 98.1955 137.048 94.9445L245.402 30.0773C251.261 26.5695 258.601 26.6796 264.352 30.3614L365.069 94.8358C370.237 98.1445 373.364 103.859 373.364 109.996V182.243C373.364 190.398 377.875 197.884 385.085 201.694L475.41 249.423C481.309 252.541 485 258.666 485 265.338V467C485 476.941 476.941 485 467 485H42C32.0589 485 24 476.941 24 467V264.951Z"
+        fill="${subColor}"
+        stroke="white"
+        stroke-width="4"
+      />
+      <path
+        d="M32 270.501C32 263.562 35.7827 257.175 41.8674 253.84L126.609 207.39C133.335 203.703 137.515 196.644 137.515 188.975V116.395C137.515 109.72 141.018 103.534 146.742 100.101L244.855 41.2512C251.056 37.5318 258.831 37.6545 264.911 41.5678L355.709 100.004C361.143 103.501 364.427 109.52 364.427 115.981V188.61C364.427 196.481 368.829 203.692 375.83 207.289L466.683 253.966C473.017 257.22 477 263.744 477 270.866V458C477 468.493 468.493 477 458 477H51C40.5066 477 32 468.493 32 458V270.501Z"
+        fill="${subColor}"
+        stroke="white"
+        stroke-width="2"
+      />
+      <path
+        d="M31 412H478V457C478 468.598 468.598 478 457 478H52C40.402 478 31 468.598 31 457V412Z"
+        fill="white"
+      />
+    </svg>
+  `;
+}

package/src/templates/badges/BadgeType45.ts

@@ -0,0 +1,93 @@
+import { ISvgProps } from "../../interface"; 
+
+export function createBadgeType45({
+  mainColor = "#96A6B4",
+  subColor = "#96A6B4",
+}: ISvgProps): string {
+  return `
+    <svg
+      width="100%"
+      height="100%"
+      viewBox="0 0 450 491"
+      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;
+      "
+    >
+      <g filter="url(#filter0_d_2407_452)">
+        <path
+          d="M424.127 358.599L239.696 474.73C230.655 480.423 219.345 480.423 210.304 474.73L25.8727 358.599C17.2664 353.183 12 343.412 12 332.874V41.9993C12 25.4255 24.7853 12 40.5688 12H409.431C425.215 12 438 25.4255 438 41.9993V332.857C438 343.395 432.734 353.167 424.127 358.583V358.599Z"
+          fill="${mainColor}"
+        />
+      </g>
+      <path
+        d="M412.909 352.787L238.868 462.95C230.336 468.35 219.664 468.35 211.132 462.95L37.0912 352.787C28.9697 347.649 24 338.38 24 328.383V52.4576C24 36.7355 36.065 24 50.9593 24H399.041C413.935 24 426 36.7355 426 52.4576V328.368C426 338.364 421.03 347.634 412.909 352.771V352.787Z"
+        fill="#101113"
+      />
+      <path
+        d="M405.43 349.138L238.316 456.068C230.124 461.311 219.876 461.311 211.684 456.068L44.5701 349.138C36.7719 344.151 32 335.154 32 325.451V57.6225C32 42.3618 43.5848 30 57.8863 30H392.114C406.415 30 418 42.3618 418 57.6225V325.436C418 335.139 413.228 344.136 405.43 349.123V349.138Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M37 57.1638C37 43.909 47.7452 33.1638 61 33.1638H389C402.255 33.1638 413 43.909 413 57.1638V236.164H37V57.1638Z"
+        fill="#101113"
+      />
+      <path
+        d="M33 319.275C33 327.207 36.9189 334.627 43.4701 339.098L213.725 455.304C220.525 459.946 229.475 459.946 236.275 455.304L406.53 339.098C413.081 334.627 417 327.207 417 319.275V228H33L33 319.275Z"
+        fill="${mainColor}"
+      />
+      <path
+        d="M32 328.098C32 331.469 33.6986 334.613 36.5182 336.461L214.036 452.814C220.694 457.178 229.306 457.178 235.964 452.814L413.482 336.461C416.301 334.613 418 331.469 418 328.098V220H32V328.098Z"
+        fill="${subColor}"
+      />
+      <path
+        d="M26 310.949C26 318.385 29.7559 325.317 35.9846 329.378L215.169 446.203C221.144 450.099 228.856 450.099 234.831 446.203L414.015 329.378C420.244 325.317 424 318.385 424 310.949V222H26V310.949Z"
+        stroke="#101113"
+        stroke-width="4"
+      />
+      <defs>
+        <filter
+          id="filter0_d_2407_452"
+          x="0"
+          y="0"
+          width="450"
+          height="491"
+          filterUnits="userSpaceOnUse"
+          color-interpolation-filters="sRGB"
+        >
+          <feFlood flood-opacity="0" result="BackgroundImageFix" />
+          <feColorMatrix
+            in="SourceAlpha"
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
+            result="hardAlpha"
+          />
+          <feOffset />
+          <feGaussianBlur stdDeviation="6" />
+          <feComposite in2="hardAlpha" operator="out" />
+          <feColorMatrix
+            type="matrix"
+            values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.2 0"
+          />
+          <feBlend
+            mode="normal"
+            in2="BackgroundImageFix"
+            result="effect1_dropShadow_2407_452"
+          />
+          <feBlend
+            mode="normal"
+            in="SourceGraphic"
+            in2="effect1_dropShadow_2407_452"
+            result="shape"
+          />
+        </filter>
+      </defs>
+    </svg>
+  `;
+}