diff --git a/public/img/failed.png b/public/img/failed.png
deleted file mode 100644
index b37545f90c..0000000000
Binary files a/public/img/failed.png and /dev/null differ
diff --git a/public/img/forgejo-loading.svg b/public/img/forgejo-loading.svg
new file mode 100644
index 0000000000..919552ebb5
--- /dev/null
+++ b/public/img/forgejo-loading.svg
@@ -0,0 +1,14 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 212 212">
+  <style>
+    @keyframes draw-orange{0%{stroke-dashoffset:200}25%{stroke-dashoffset:200;stroke-width:0}50%{stroke-dashoffset:0;stroke-width:25}to{stroke-dashoffset:0}}@keyframes draw-red{0%{stroke-dashoffset:130;stroke-width:0}25%{stroke-dashoffset:0;stroke-width:25}50%,to{stroke-dashoffset:0}}@keyframes red-circle{0%{opacity:0}20%{opacity:0;stroke-width:0}25%{opacity:1;stroke-width:15}to{opacity:1}}@keyframes orange-circle{0%{opacity:0}45%{opacity:0;stroke-width:0}50%{opacity:1;stroke-width:15}to{opacity:1}}@keyframes fade{0%,90%{opacity:1}to{opacity:0}}circle,path{fill:none;stroke:#000;stroke-width:15}path{stroke-width:25}.orange{stroke:#f60}.red{stroke:#d40000}
+  </style>
+  <g transform="translate(6 6)">
+    <g style="animation:fade 2000ms ease-in-out 5ms infinite">
+      <path d="M58 168V70a50 50 0 0 1 50-50h20" class="orange" style="stroke-dasharray:200;stroke-dashoffset:200;animation:draw-orange 2000ms ease-out 5ms infinite"/>
+      <path d="M58 168v-30a50 50 0 0 1 50-50h20" class="red" style="stroke-dasharray:130;stroke-dashoffset:130;animation:draw-red 2000ms ease-out 5ms infinite"/>
+      <circle cx="142" cy="20" r="18" class="orange" style="opacity:0;animation:orange-circle 2000ms ease-out 5ms infinite"/>
+      <circle cx="142" cy="88" r="18" class="red" style="opacity:0;animation:red-circle 2000ms ease-out 5ms infinite"/>
+    </g>
+    <circle cx="58" cy="180" r="18" class="red"/>
+  </g>
+</svg>
diff --git a/public/img/loading.png b/public/img/loading.png
deleted file mode 100644
index c5ba3d9cd7..0000000000
Binary files a/public/img/loading.png and /dev/null differ
diff --git a/templates/install.tmpl b/templates/install.tmpl
index 1716d0a5e4..4c06cb5ebb 100644
--- a/templates/install.tmpl
+++ b/templates/install.tmpl
@@ -347,5 +347,5 @@
 		</div>
 	</div>
 </div>
-<img class="gt-hidden" src="{{AssetUrlPrefix}}/img/loading.png">
+<img class="gt-hidden" src="{{AssetUrlPrefix}}/img/forgejo-loading.svg" width="256" height="256">
 {{template "base/footer" .}}
diff --git a/templates/post-install.tmpl b/templates/post-install.tmpl
index 5048b910d8..d907fa1f87 100644
--- a/templates/post-install.tmpl
+++ b/templates/post-install.tmpl
@@ -7,7 +7,7 @@
 					<div class="ui stackable middle very relaxed page grid">
 						<div class="sixteen wide center aligned centered column">
 							<div>
-								<img src="{{AssetUrlPrefix}}/img/loading.png" alt="{{.locale.Tr "loading"}}">
+								<img src="{{AssetUrlPrefix}}/img/forgejo-loading.svg" alt="{{.locale.Tr "loading"}}" width="256" height="256">
 							</div>
 						</div>
 					</div>
diff --git a/templates/repo/migrate/migrating.tmpl b/templates/repo/migrate/migrating.tmpl
index 50bff0a937..04e4bd53ec 100644
--- a/templates/repo/migrate/migrating.tmpl
+++ b/templates/repo/migrate/migrating.tmpl
@@ -9,12 +9,12 @@
 					<div class="ui stackable middle very relaxed page grid">
 						<div id="repo_migrating" class="sixteen wide center aligned centered column" data-migrating-task-id="{{.MigrateTask.ID}}">
 							<div>
-								<img src="{{AssetUrlPrefix}}/img/loading.png">
+								<img src="{{AssetUrlPrefix}}/img/forgejo-loading.svg" width="256" height="256">
 							</div>
 						</div>
 						<div id="repo_migrating_failed_image" class="sixteen wide center aligned centered column gt-hidden">
 							<div>
-								<img src="{{AssetUrlPrefix}}/img/failed.png">
+								<span class="red">{{svg "octicon-git-pull-request-closed" 256 "ui red icon"}}</span>
 							</div>
 						</div>
 					</div>