diff --git a/backend/src/Squidex/wwwroot/images/loader-white.gif b/backend/src/Squidex/wwwroot/images/loader-white.gif
deleted file mode 100644
index 7fefdbce7..000000000
Binary files a/backend/src/Squidex/wwwroot/images/loader-white.gif and /dev/null differ
diff --git a/backend/src/Squidex/wwwroot/images/loader.gif b/backend/src/Squidex/wwwroot/images/loader.gif
deleted file mode 100644
index 0a8226a3b..000000000
Binary files a/backend/src/Squidex/wwwroot/images/loader.gif and /dev/null differ
diff --git a/backend/src/Squidex/wwwroot/images/loader.svg b/backend/src/Squidex/wwwroot/images/loader.svg
new file mode 100644
index 000000000..a48faec5a
--- /dev/null
+++ b/backend/src/Squidex/wwwroot/images/loader.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin: auto; background: none; display: block; shape-rendering: auto;" width="50px" height="50px" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
+<circle cx="50" cy="50" fill="none" stroke="#3389ff" stroke-width="12" r="35" stroke-dasharray="164.93361431346415 56.97787143782138">
+  <animateTransform attributeName="transform" type="rotate" repeatCount="indefinite" dur="1s" values="0 50 50;360 50 50" keyTimes="0;1"></animateTransform>
+</circle>
+<!-- [ldio] generated by https://loading.io/ --></svg>
\ No newline at end of file
diff --git a/backend/src/Squidex/wwwroot/images/logo-white.svg b/backend/src/Squidex/wwwroot/images/logo-white.svg
new file mode 100644
index 000000000..c13709328
--- /dev/null
+++ b/backend/src/Squidex/wwwroot/images/logo-white.svg
@@ -0,0 +1,6 @@
+<?xml version="1.0" encoding="utf-8"?>
+<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" style="margin: auto; background: none; display: block; shape-rendering: auto;" width="50px" height="50px" viewBox="0 0 100 100" preserveAspectRatio="xMidYMid">
+<circle cx="50" cy="50" fill="none" stroke="#ffffff" stroke-width="12" r="35" stroke-dasharray="164.93361431346415 56.97787143782138">
+  <animateTransform attributeName="transform" type="rotate" repeatCount="indefinite" dur="1s" values="0 50 50;360 50 50" keyTimes="0;1"></animateTransform>
+</circle>
+<!-- [ldio] generated by https://loading.io/ --></svg>
\ No newline at end of file
diff --git a/frontend/app/app.component.html b/frontend/app/app.component.html
index 9e34c89ae..e00fd2912 100644
--- a/frontend/app/app.component.html
+++ b/frontend/app/app.component.html
@@ -3,7 +3,7 @@
         <sqx-dialog-renderer>
             <router-outlet (activate)="isLoaded = true">
                 <div class="loading" *ngIf="!isLoaded">
-                    <img alt="Loading" src="./images/loader.gif">
+                    <img alt="Loading" src="./images/loader.svg">
 
                     <div>{{ 'common.loading' | sqxTranslate }}</div>
                 </div>
diff --git a/frontend/app/index.html b/frontend/app/index.html
index 2b56157ae..f87298e8a 100644
--- a/frontend/app/index.html
+++ b/frontend/app/index.html
@@ -50,7 +50,7 @@
 <body>
     <sqx-app>
         <div class="loading">
-            <img src="./images/loader.gif">
+            <img src="./images/loader.svg">
 
             <div>Loading Squidex</div>
         </div>
diff --git a/frontend/app/shell/pages/home/home-page.component.html b/frontend/app/shell/pages/home/home-page.component.html
index 3bf3f9e99..bdb389fc8 100644
--- a/frontend/app/shell/pages/home/home-page.component.html
+++ b/frontend/app/shell/pages/home/home-page.component.html
@@ -1,7 +1,7 @@
 <div class="login-area">
     <div class="card">
         <div class="card-body text-center">
-            <img alt="Logo" class="login-icon login-element" src="./images/logo.png">
+            <img alt="Logo" class="login-icon login-element" src="./images/logo.svg">
 
             <div>
                 <button type="button" class="btn btn-success btn-lg login-button login-element" (click)="login()">
diff --git a/frontend/app/shell/pages/internal/logo.component.html b/frontend/app/shell/pages/internal/logo.component.html
index 45f21cbe7..df9e37af4 100644
--- a/frontend/app/shell/pages/internal/logo.component.html
+++ b/frontend/app/shell/pages/internal/logo.component.html
@@ -1,3 +1,3 @@
-<img [class.hidden]="!isLoading" class="loader" src="./images/loader-white.gif" />
+<img [class.hidden]="!isLoading" class="loader" src="./images/loader-white.svg" />
 
 <i [class.hidden]="isLoading" class="icon-logo"></i>
\ No newline at end of file
diff --git a/frontend/app/shell/pages/internal/logo.component.scss b/frontend/app/shell/pages/internal/logo.component.scss
index 28f40727d..6ad539f08 100644
--- a/frontend/app/shell/pages/internal/logo.component.scss
+++ b/frontend/app/shell/pages/internal/logo.component.scss
@@ -1,3 +1,6 @@
 .loader {
-    @include absolute(12px, null, null, 20px);
+    @include absolute(50%, null, null, 50%);
+    margin-left: -14px;
+    margin-top: -14px;
+    width: 28px;
 }
\ No newline at end of file
