diff --git a/static/logo-colored.svg b/static/logo-colored.svg
new file mode 100644
index 0000000..ba2f830
--- /dev/null
+++ b/static/logo-colored.svg
@@ -0,0 +1,51 @@
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <linearGradient id="bg">
+      <stop offset="0%" stop-color="#103783" />
+      <stop offset="100%" stop-color="#9bafd9" />
+    </linearGradient>
+
+    <g id="ray-a">
+      <rect x="18" y="-3" height="6" rx="3">
+        <animate attributeName="width" values="20;25;20" dur="4s" repeatCount="indefinite" />
+      </rect>
+      <circle cy="0" r="3">
+        <animate attributeName="cx" values="47;40;47" dur="4s" repeatCount="indefinite" />
+      </circle>
+    </g>
+    <g id="ray-b">
+      <rect x="18" y="-3" height="6" rx="3">
+        <animate attributeName="width" values="25;20;25" dur="4s" repeatCount="indefinite" />
+      </rect>
+      <circle cy="0" r="3">
+        <animate attributeName="cx" values="40;47;40" dur="4s" repeatCount="indefinite" />
+      </circle>
+    </g>
+  </defs>
+
+  <mask fill="white" id="mask">
+    <g transform-origin="50 50">
+      <circle cx="50" cy="50" r="14" />
+      <use href="#ray-a" transform="translate(50 50) rotate(0 0 0)" />
+      <use href="#ray-a" transform="translate(50 50) rotate(90 0 0)" />
+      <use href="#ray-a" transform="translate(50 50) rotate(180 0 0)" />
+      <use href="#ray-a" transform="translate(50 50) rotate(270 0 0)" />
+      <use href="#ray-b" transform="translate(50 50) rotate(45 0 0)" />
+      <use href="#ray-b" transform="translate(50 50) rotate(135 0 0)" />
+      <use href="#ray-b" transform="translate(50 50) rotate(225 0 0) " />
+      <use href="#ray-b" transform="translate(50 50) rotate(315 0 0)" />
+      <animateTransform 
+        attributeName="transform" 
+        type="rotate"
+        values="0;90" 
+        dur="6s" 
+        repeatCount="indefinite" 
+      />
+    </g>
+  </mask>
+
+  <rect width="100%" height="100%" fill="url(#bg)" mask="url(#mask)">
+    
+  </rect>
+
+</svg>
diff --git a/static/logo-white.svg b/static/logo-white.svg
new file mode 100644
index 0000000..3569c14
--- /dev/null
+++ b/static/logo-white.svg
@@ -0,0 +1,43 @@
+<svg viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <g id="ray-a">
+      <rect x="18" y="-3" height="6" rx="3">
+        <animate attributeName="width" values="20;25;20" dur="4s" repeatCount="indefinite" />
+      </rect>
+      <circle cy="0" r="3">
+        <animate attributeName="cx" values="47;40;47" dur="4s" repeatCount="indefinite" />
+      </circle>
+    </g>
+    <g id="ray-b">
+      <rect x="18" y="-3" height="6" rx="3">
+        <animate attributeName="width" values="25;20;25" dur="4s" repeatCount="indefinite" />
+      </rect>
+      <circle cy="0" r="3">
+        <animate attributeName="cx" values="40;47;40" dur="4s" repeatCount="indefinite" />
+      </circle>
+    </g>
+  </defs>
+
+  <mask fill="white" id="mask">
+    <g transform-origin="50% 50%">
+      <circle cx="50" cy="50" r="14" />
+      <use href="#ray-a" transform="translate(50 50) rotate(0 0 0)" />
+      <use href="#ray-a" transform="translate(50 50) rotate(90 0 0)" />
+      <use href="#ray-a" transform="translate(50 50) rotate(180 0 0)" />
+      <use href="#ray-a" transform="translate(50 50) rotate(270 0 0)" />
+      <use href="#ray-b" transform="translate(50 50) rotate(45 0 0)" />
+      <use href="#ray-b" transform="translate(50 50) rotate(135 0 0)" />
+      <use href="#ray-b" transform="translate(50 50) rotate(225 0 0) " />
+      <use href="#ray-b" transform="translate(50 50) rotate(315 0 0)" />
+      <animateTransform 
+        attributeName="transform" 
+        type="rotate"
+        values="0;90" 
+        dur="8s" 
+        repeatCount="indefinite" 
+      />
+    </g>
+  </mask>
+
+  <rect width="100%" height="100%" fill="white" mask="url(#mask)"/>
+</svg>