diff --git a/quartz/components/ReaderMode.tsx b/quartz/components/ReaderMode.tsx
index dac4053d9..4b3165e6e 100644
--- a/quartz/components/ReaderMode.tsx
+++ b/quartz/components/ReaderMode.tsx
@@ -2,25 +2,31 @@
 import readerModeScript from "./scripts/readermode.inline"
 import styles from "./styles/readermode.scss"
 import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types"
+import { i18n } from "../i18n"
 import { classNames } from "../util/lang"
 
-const ReaderMode: QuartzComponent = ({ displayClass }: QuartzComponentProps) => {
+const ReaderMode: QuartzComponent = ({ displayClass, cfg }: QuartzComponentProps) => {
   return (
     <button class={classNames(displayClass, "readermode")}>
       <svg
         xmlns="http://www.w3.org/2000/svg"
+        xmlnsXlink="http://www.w3.org/1999/xlink"
+        version="1.1"
         class="readerIcon"
-        viewBox="0 0 24 24"
-        fill="none"
+        fill="currentColor"
         stroke="currentColor"
-        stroke-width="2"
+        stroke-width="0.2"
         stroke-linecap="round"
         stroke-linejoin="round"
+        width="64px"
+        height="64px"
+        viewBox="0 0 24 24"
+        aria-label={i18n(cfg.locale).components.readerMode.title}
       >
-        <rect x="6" y="4" width="12" height="16" rx="1"></rect>
-        <line x1="9" y1="8" x2="15" y2="8"></line>
-        <line x1="9" y1="12" x2="15" y2="12"></line>
-        <line x1="9" y1="16" x2="13" y2="16"></line>
+        <title>{i18n(cfg.locale).components.readerMode.title}</title>
+        <g transform="translate(-1.8, -1.8) scale(1.15, 1.2)">
+          <path d="M8.9891247,2.5 C10.1384702,2.5 11.2209868,2.96705384 12.0049645,3.76669482 C12.7883914,2.96705384 13.8709081,2.5 15.0202536,2.5 L18.7549359,2.5 C19.1691495,2.5 19.5049359,2.83578644 19.5049359,3.25 L19.5046891,4.004 L21.2546891,4.00457396 C21.6343849,4.00457396 21.9481801,4.28672784 21.9978425,4.6528034 L22.0046891,4.75457396 L22.0046891,20.25 C22.0046891,20.6296958 21.7225353,20.943491 21.3564597,20.9931534 L21.2546891,21 L2.75468914,21 C2.37499337,21 2.06119817,20.7178461 2.01153575,20.3517706 L2.00468914,20.25 L2.00468914,4.75457396 C2.00468914,4.37487819 2.28684302,4.061083 2.65291858,4.01142057 L2.75468914,4.00457396 L4.50368914,4.004 L4.50444233,3.25 C4.50444233,2.87030423 4.78659621,2.55650904 5.15267177,2.50684662 L5.25444233,2.5 L8.9891247,2.5 Z M4.50368914,5.504 L3.50468914,5.504 L3.50468914,19.5 L10.9478955,19.4998273 C10.4513189,18.9207296 9.73864328,18.5588115 8.96709342,18.5065584 L8.77307039,18.5 L5.25444233,18.5 C4.87474657,18.5 4.56095137,18.2178461 4.51128895,17.8517706 L4.50444233,17.75 L4.50368914,5.504 Z M19.5049359,17.75 C19.5049359,18.1642136 19.1691495,18.5 18.7549359,18.5 L15.2363079,18.5 C14.3910149,18.5 13.5994408,18.8724714 13.0614828,19.4998273 L20.5046891,19.5 L20.5046891,5.504 L19.5046891,5.504 L19.5049359,17.75 Z M18.0059359,3.999 L15.0202536,4 L14.8259077,4.00692283 C13.9889509,4.06666544 13.2254227,4.50975805 12.7549359,5.212 L12.7549359,17.777 L12.7782651,17.7601316 C13.4923805,17.2719483 14.3447024,17 15.2363079,17 L18.0059359,16.999 L18.0056891,4.798 L18.0033792,4.75457396 L18.0056891,4.71 L18.0059359,3.999 Z M8.9891247,4 L6.00368914,3.999 L6.00599909,4.75457396 L6.00599909,4.75457396 L6.00368914,4.783 L6.00368914,16.999 L8.77307039,17 C9.57551536,17 10.3461406,17.2202781 11.0128313,17.6202194 L11.2536891,17.776 L11.2536891,5.211 C10.8200889,4.56369974 10.1361548,4.13636104 9.37521067,4.02745763 L9.18347055,4.00692283 L8.9891247,4 Z" />
+        </g>
       </svg>
     </button>
   )
diff --git a/quartz/components/styles/readermode.scss b/quartz/components/styles/readermode.scss
index 7d5de7703..79332c3b6 100644
--- a/quartz/components/styles/readermode.scss
+++ b/quartz/components/styles/readermode.scss
@@ -15,6 +15,7 @@
     width: 20px;
     height: 20px;
     top: calc(50% - 10px);
+    fill: var(--darkgray);
     stroke: var(--darkgray);
     transition: opacity 0.1s ease;
   }
diff --git a/quartz/i18n/locales/ar-SA.ts b/quartz/i18n/locales/ar-SA.ts
index 8463e2ff5..a1979def9 100644
--- a/quartz/i18n/locales/ar-SA.ts
+++ b/quartz/i18n/locales/ar-SA.ts
@@ -32,6 +32,9 @@ export default {
     explorer: {
       title: "المستعرض",
     },
+    readerMode: {
+      title: "وضع القارئ",
+    },
     footer: {
       createdWith: "أُنشئ باستخدام",
     },
diff --git a/quartz/i18n/locales/ca-ES.ts b/quartz/i18n/locales/ca-ES.ts
index aadbd4157..1483d9c57 100644
--- a/quartz/i18n/locales/ca-ES.ts
+++ b/quartz/i18n/locales/ca-ES.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Mode clar",
       darkMode: "Mode fosc",
     },
+    readerMode: {
+      title: "Mode lector",
+    },
     explorer: {
       title: "Explorador",
     },
diff --git a/quartz/i18n/locales/cs-CZ.ts b/quartz/i18n/locales/cs-CZ.ts
index bf089d137..87f19964f 100644
--- a/quartz/i18n/locales/cs-CZ.ts
+++ b/quartz/i18n/locales/cs-CZ.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Světlý režim",
       darkMode: "Tmavý režim",
     },
+    readerMode: {
+      title: "Režim čtečky",
+    },
     explorer: {
       title: "Procházet",
     },
diff --git a/quartz/i18n/locales/de-DE.ts b/quartz/i18n/locales/de-DE.ts
index 023d4be33..85a7353a8 100644
--- a/quartz/i18n/locales/de-DE.ts
+++ b/quartz/i18n/locales/de-DE.ts
@@ -26,8 +26,11 @@ export default {
       noBacklinksFound: "Keine Backlinks gefunden",
     },
     themeToggle: {
-      lightMode: "Light Mode",
-      darkMode: "Dark Mode",
+      lightMode: "Heller Modus",
+      darkMode: "Dunkler Modus",
+    },
+    readerMode: {
+      title: "Lesemodus",
     },
     explorer: {
       title: "Explorer",
diff --git a/quartz/i18n/locales/definition.ts b/quartz/i18n/locales/definition.ts
index 25a8cd7f2..ee1649abc 100644
--- a/quartz/i18n/locales/definition.ts
+++ b/quartz/i18n/locales/definition.ts
@@ -31,6 +31,9 @@ export interface Translation {
       lightMode: string
       darkMode: string
     }
+    readerMode: {
+      title: string
+    }
     explorer: {
       title: string
     }
diff --git a/quartz/i18n/locales/en-GB.ts b/quartz/i18n/locales/en-GB.ts
index 5388b032c..80e52bf3c 100644
--- a/quartz/i18n/locales/en-GB.ts
+++ b/quartz/i18n/locales/en-GB.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Light mode",
       darkMode: "Dark mode",
     },
+    readerMode: {
+      title: "Reader mode",
+    },
     explorer: {
       title: "Explorer",
     },
diff --git a/quartz/i18n/locales/en-US.ts b/quartz/i18n/locales/en-US.ts
index 22cf31e01..e1111e9ab 100644
--- a/quartz/i18n/locales/en-US.ts
+++ b/quartz/i18n/locales/en-US.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Light mode",
       darkMode: "Dark mode",
     },
+    readerMode: {
+      title: "Reader mode",
+    },
     explorer: {
       title: "Explorer",
     },
diff --git a/quartz/i18n/locales/es-ES.ts b/quartz/i18n/locales/es-ES.ts
index c4a57aa12..b7e425e81 100644
--- a/quartz/i18n/locales/es-ES.ts
+++ b/quartz/i18n/locales/es-ES.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Modo claro",
       darkMode: "Modo oscuro",
     },
+    readerMode: {
+      title: "Modo lector",
+    },
     explorer: {
       title: "Explorador",
     },
diff --git a/quartz/i18n/locales/fa-IR.ts b/quartz/i18n/locales/fa-IR.ts
index 5bfef5aee..0300174f3 100644
--- a/quartz/i18n/locales/fa-IR.ts
+++ b/quartz/i18n/locales/fa-IR.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "حالت روشن",
       darkMode: "حالت تاریک",
     },
+    readerMode: {
+      title: "حالت خواندن",
+    },
     explorer: {
       title: "مطالب",
     },
diff --git a/quartz/i18n/locales/fi-FI.ts b/quartz/i18n/locales/fi-FI.ts
index f173afae4..19e102a31 100644
--- a/quartz/i18n/locales/fi-FI.ts
+++ b/quartz/i18n/locales/fi-FI.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Vaalea tila",
       darkMode: "Tumma tila",
     },
+    readerMode: {
+      title: "Lukijatila",
+    },
     explorer: {
       title: "Selain",
     },
diff --git a/quartz/i18n/locales/fr-FR.ts b/quartz/i18n/locales/fr-FR.ts
index ef43fa876..f6df309a6 100644
--- a/quartz/i18n/locales/fr-FR.ts
+++ b/quartz/i18n/locales/fr-FR.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Mode clair",
       darkMode: "Mode sombre",
     },
+    readerMode: {
+      title: "Mode lecture",
+    },
     explorer: {
       title: "Explorateur",
     },
diff --git a/quartz/i18n/locales/hu-HU.ts b/quartz/i18n/locales/hu-HU.ts
index 066b7770e..2a4f07727 100644
--- a/quartz/i18n/locales/hu-HU.ts
+++ b/quartz/i18n/locales/hu-HU.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Világos mód",
       darkMode: "Sötét mód",
     },
+    readerMode: {
+      title: "Olvasó mód",
+    },
     explorer: {
       title: "Fájlböngésző",
     },
diff --git a/quartz/i18n/locales/it-IT.ts b/quartz/i18n/locales/it-IT.ts
index c8c597352..be25bb640 100644
--- a/quartz/i18n/locales/it-IT.ts
+++ b/quartz/i18n/locales/it-IT.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Tema chiaro",
       darkMode: "Tema scuro",
     },
+    readerMode: {
+      title: "Modalità lettura",
+    },
     explorer: {
       title: "Esplora",
     },
diff --git a/quartz/i18n/locales/ja-JP.ts b/quartz/i18n/locales/ja-JP.ts
index 9581b5ed3..3c30124d7 100644
--- a/quartz/i18n/locales/ja-JP.ts
+++ b/quartz/i18n/locales/ja-JP.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "ライトモード",
       darkMode: "ダークモード",
     },
+    readerMode: {
+      title: "リーダーモード",
+    },
     explorer: {
       title: "エクスプローラー",
     },
diff --git a/quartz/i18n/locales/ko-KR.ts b/quartz/i18n/locales/ko-KR.ts
index 9be08d98f..1bca096b2 100644
--- a/quartz/i18n/locales/ko-KR.ts
+++ b/quartz/i18n/locales/ko-KR.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "라이트 모드",
       darkMode: "다크 모드",
     },
+    readerMode: {
+      title: "리더 모드",
+    },
     explorer: {
       title: "탐색기",
     },
diff --git a/quartz/i18n/locales/lt-LT.ts b/quartz/i18n/locales/lt-LT.ts
index d48e593c9..690960c35 100644
--- a/quartz/i18n/locales/lt-LT.ts
+++ b/quartz/i18n/locales/lt-LT.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Šviesus Režimas",
       darkMode: "Tamsus Režimas",
     },
+    readerMode: {
+      title: "Modalità lettore",
+    },
     explorer: {
       title: "Naršyklė",
     },
diff --git a/quartz/i18n/locales/nb-NO.ts b/quartz/i18n/locales/nb-NO.ts
index 5823b19b1..0e415221e 100644
--- a/quartz/i18n/locales/nb-NO.ts
+++ b/quartz/i18n/locales/nb-NO.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Lys modus",
       darkMode: "Mørk modus",
     },
+    readerMode: {
+      title: "Læsemodus",
+    },
     explorer: {
       title: "Utforsker",
     },
diff --git a/quartz/i18n/locales/nl-NL.ts b/quartz/i18n/locales/nl-NL.ts
index ccbafa7b3..8ab3b0722 100644
--- a/quartz/i18n/locales/nl-NL.ts
+++ b/quartz/i18n/locales/nl-NL.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Lichte modus",
       darkMode: "Donkere modus",
     },
+    readerMode: {
+      title: "Leesmodus",
+    },
     explorer: {
       title: "Verkenner",
     },
diff --git a/quartz/i18n/locales/pl-PL.ts b/quartz/i18n/locales/pl-PL.ts
index 7fa0cd47a..11033e30f 100644
--- a/quartz/i18n/locales/pl-PL.ts
+++ b/quartz/i18n/locales/pl-PL.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Trzyb jasny",
       darkMode: "Tryb ciemny",
     },
+    readerMode: {
+      title: "Tryb czytania",
+    },
     explorer: {
       title: "Przeglądaj",
     },
diff --git a/quartz/i18n/locales/pt-BR.ts b/quartz/i18n/locales/pt-BR.ts
index c7b6bfb60..e431d8ed5 100644
--- a/quartz/i18n/locales/pt-BR.ts
+++ b/quartz/i18n/locales/pt-BR.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Tema claro",
       darkMode: "Tema escuro",
     },
+    readerMode: {
+      title: "Modo leitor",
+    },
     explorer: {
       title: "Explorador",
     },
diff --git a/quartz/i18n/locales/ro-RO.ts b/quartz/i18n/locales/ro-RO.ts
index 2de1c8cd9..007d90169 100644
--- a/quartz/i18n/locales/ro-RO.ts
+++ b/quartz/i18n/locales/ro-RO.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Modul luminos",
       darkMode: "Modul întunecat",
     },
+    readerMode: {
+      title: "Modul de citire",
+    },
     explorer: {
       title: "Explorator",
     },
diff --git a/quartz/i18n/locales/ru-RU.ts b/quartz/i18n/locales/ru-RU.ts
index 18e081734..5534d140c 100644
--- a/quartz/i18n/locales/ru-RU.ts
+++ b/quartz/i18n/locales/ru-RU.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Светлый режим",
       darkMode: "Тёмный режим",
     },
+    readerMode: {
+      title: "Режим чтения",
+    },
     explorer: {
       title: "Проводник",
     },
diff --git a/quartz/i18n/locales/th-TH.ts b/quartz/i18n/locales/th-TH.ts
index 4ea84868c..073013196 100644
--- a/quartz/i18n/locales/th-TH.ts
+++ b/quartz/i18n/locales/th-TH.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "โหมดสว่าง",
       darkMode: "โหมดมืด",
     },
+    readerMode: {
+      title: "โหมดอ่าน",
+    },
     explorer: {
       title: "รายการหน้า",
     },
diff --git a/quartz/i18n/locales/tr-TR.ts b/quartz/i18n/locales/tr-TR.ts
index a3805d1a9..9c2d6d4ad 100644
--- a/quartz/i18n/locales/tr-TR.ts
+++ b/quartz/i18n/locales/tr-TR.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Açık mod",
       darkMode: "Koyu mod",
     },
+    readerMode: {
+      title: "Okuma modu",
+    },
     explorer: {
       title: "Gezgin",
     },
diff --git a/quartz/i18n/locales/uk-UA.ts b/quartz/i18n/locales/uk-UA.ts
index 469de4f80..ac2a24850 100644
--- a/quartz/i18n/locales/uk-UA.ts
+++ b/quartz/i18n/locales/uk-UA.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Світлий режим",
       darkMode: "Темний режим",
     },
+    readerMode: {
+      title: "Режим читання",
+    },
     explorer: {
       title: "Провідник",
     },
diff --git a/quartz/i18n/locales/vi-VN.ts b/quartz/i18n/locales/vi-VN.ts
index 39a8fbcc1..26a58a50e 100644
--- a/quartz/i18n/locales/vi-VN.ts
+++ b/quartz/i18n/locales/vi-VN.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "Sáng",
       darkMode: "Tối",
     },
+    readerMode: {
+      title: "Chế độ đọc",
+    },
     explorer: {
       title: "Trong bài này",
     },
diff --git a/quartz/i18n/locales/zh-CN.ts b/quartz/i18n/locales/zh-CN.ts
index b710db539..09951bbb3 100644
--- a/quartz/i18n/locales/zh-CN.ts
+++ b/quartz/i18n/locales/zh-CN.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "亮色模式",
       darkMode: "暗色模式",
     },
+    readerMode: {
+      title: "阅读模式",
+    },
     explorer: {
       title: "探索",
     },
diff --git a/quartz/i18n/locales/zh-TW.ts b/quartz/i18n/locales/zh-TW.ts
index f0db0bf0c..4e784c06d 100644
--- a/quartz/i18n/locales/zh-TW.ts
+++ b/quartz/i18n/locales/zh-TW.ts
@@ -29,6 +29,9 @@ export default {
       lightMode: "亮色模式",
       darkMode: "暗色模式",
     },
+    readerMode: {
+      title: "閱讀模式",
+    },
     explorer: {
       title: "探索",
     },