diff --git a/docs/de/docs/index.md b/docs/de/docs/index.md
index bb28c68f70..4c2c16f6ba 100644
--- a/docs/de/docs/index.md
+++ b/docs/de/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/en/docs/index.md b/docs/en/docs/index.md
index 7f9d5efbf2..930fb254bb 100644
--- a/docs/en/docs/index.md
+++ b/docs/en/docs/index.md
@@ -125,7 +125,12 @@ There's a <a href="https://www.youtube.com/watch?v=mpR8ngthqiE" class="external-
 
 ## **Typer**, the FastAPI of CLIs { #typer-the-fastapi-of-clis }
 
-<a href="https://typer.tiangolo.com" target="_blank"><img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;"></a>
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 
 If you are building a <abbr title="Command Line Interface">CLI</abbr> app to be used in the terminal instead of a web API, check out <a href="https://typer.tiangolo.com/" class="external-link" target="_blank">**Typer**</a>.
 
diff --git a/docs/es/docs/index.md b/docs/es/docs/index.md
index 0544eb9ba4..9f87ba5b63 100644
--- a/docs/es/docs/index.md
+++ b/docs/es/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/fr/docs/index.md b/docs/fr/docs/index.md
index bf4446b940..73e35372bd 100644
--- a/docs/fr/docs/index.md
+++ b/docs/fr/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/ja/docs/index.md b/docs/ja/docs/index.md
index 90368b4ae3..5a33037d38 100644
--- a/docs/ja/docs/index.md
+++ b/docs/ja/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/ko/docs/index.md b/docs/ko/docs/index.md
index d2e08be16f..f638e29e71 100644
--- a/docs/ko/docs/index.md
+++ b/docs/ko/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/pt/docs/index.md b/docs/pt/docs/index.md
index c337f6d3ac..cd415d169a 100644
--- a/docs/pt/docs/index.md
+++ b/docs/pt/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/ru/docs/index.md b/docs/ru/docs/index.md
index 877014a086..56a0f75f26 100644
--- a/docs/ru/docs/index.md
+++ b/docs/ru/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/tr/docs/index.md b/docs/tr/docs/index.md
index f240a96914..3ce12bd426 100644
--- a/docs/tr/docs/index.md
+++ b/docs/tr/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/uk/docs/index.md b/docs/uk/docs/index.md
index 0a6788502a..0ece09f9da 100644
--- a/docs/uk/docs/index.md
+++ b/docs/uk/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/zh-hant/docs/index.md b/docs/zh-hant/docs/index.md
index 77eba9b149..94732cdbf4 100644
--- a/docs/zh-hant/docs/index.md
+++ b/docs/zh-hant/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>
diff --git a/docs/zh/docs/index.md b/docs/zh/docs/index.md
index 38e128bf14..438f180ad7 100644
--- a/docs/zh/docs/index.md
+++ b/docs/zh/docs/index.md
@@ -1,3 +1,9 @@
+<a href="https://typer.tiangolo.com" target="_blank">
+    <picture>
+        <source media="(prefers-color-scheme: dark)" srcset="https://typer.tiangolo.com/img/logo-margin/logo-margin-white-vector.svg#only-dark">
+        <img src="https://typer.tiangolo.com/img/logo-margin/logo-margin-vector.svg" style="width: 20%;">
+    </picture>
+</a>
 # FastAPI { #fastapi }
 
 <style>