From 207d6b75ffa91450481955ef617c5f0819ecadfa Mon Sep 17 00:00:00 2001
From: thePR0M3TH3AN <53631862+PR0M3TH3AN@users.noreply.github.com>
Date: Sun, 12 Oct 2025 20:30:54 -0400
Subject: [PATCH] Refactor logos to use token-driven colors

---
 README.md                             | 13 +++++++
 assets/svg/bitvid-logo-dark-mode.svg  | 50 ++++++++++-----------------
 assets/svg/bitvid-logo-light-mode.svg | 50 ++++++++++-----------------
 bitvid_logo/beacon-icon.svg           | 10 +++---
 bitvid_logo/bitvid-01.svg             | 46 ++++++++++--------------
 bitvid_logo/bitvid-02.svg             | 46 ++++++++++--------------
 bitvid_logo/bitvid-03.svg             | 50 ++++++++++-----------------
 bitvid_logo/bitvid-04.svg             | 50 ++++++++++-----------------
 bitvid_logo/bitvid-05.svg             | 32 +++++++----------
 bitvid_logo/bitvid-06.svg             | 32 +++++++----------
 bitvid_logo/bitvid-07.svg             | 32 +++++++----------
 bitvid_logo/bitvid-08.svg             | 24 +++++--------
 bitvid_logo/bitvid-09.svg             | 24 +++++--------
 bitvid_logo/bitvid-10.svg             | 24 +++++--------
 bitvid_logo/bitvid-11.svg             | 38 +++++++-------------
 bitvid_logo/bitvid-12.svg             | 38 +++++++-------------
 bitvid_logo/bitvid-13.svg             | 38 +++++++-------------
 bitvid_logo/bitvid-14.svg             | 38 +++++++-------------
 bitvid_logo/bitvid-15.svg             | 38 +++++++-------------
 bitvid_logo/bitvid-16.svg             | 38 +++++++-------------
 bitvid_logo/dns-icon.svg              |  6 ++--
 bitvid_logo/guidelines-icon.svg       |  6 ++--
 bitvid_logo/home-icon.svg             |  6 ++--
 bitvid_logo/ipns-icon.svg             |  6 ++--
 components/disclaimer.html            | 39 ++++++++++++++++++---
 css/tokens.css                        |  5 +++
 index.html                            | 39 ++++++++++++++++++---
 torrent/beacon.html                   | 39 ++++++++++++++++++---
 28 files changed, 387 insertions(+), 470 deletions(-)

diff --git a/README.md b/README.md
index 9f31120b..c30bb628 100644
--- a/README.md
+++ b/README.md
@@ -97,6 +97,19 @@ emits the purged, minified stylesheet at `css/tailwind.generated.css`. Commit th
 regenerated file alongside any template changes so deployments pick up the
 latest styles.
 
+### Logo usage
+
+- SVG wordmarks and icons now express their fills through `currentColor` and
+  component-level variables (`--logo-wordmark-color`, `--logo-accent-color`, and
+  related background tokens) that default to palette values in
+  `css/tokens.css`.
+- When embedding a logo, wrap the inline `<svg>` in an element that sets
+  `--logo-wordmark-color` (usually to `currentColor`) and, when needed,
+  `--logo-accent-color`. Tailwind text utilities such as `text-text-strong` or
+  `text-text` ensure the wrapper resolves to a token-backed color.
+- Avoid hard-coded hex colors in SVGs; instead, override the logo variables in
+  CSS if a deployment needs a different accent or background.
+
 ### Configuration
 
 - **`config/instance-config.js`**:
diff --git a/assets/svg/bitvid-logo-dark-mode.svg b/assets/svg/bitvid-logo-dark-mode.svg
index 4cded503..45b67504 100644
--- a/assets/svg/bitvid-logo-dark-mode.svg
+++ b/assets/svg/bitvid-logo-dark-mode.svg
@@ -1,33 +1,21 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-
-      .cls-2 {
-        fill: #fff;
-      }
-    </style>
-  </defs>
-  <g>
-    <rect class="cls-1" x="7.1" y="7.8" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="18.78" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="29.77" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="40.76" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="51.75" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="62.74" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="73.73" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="84.72" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="95.71" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98" color="var(--logo-wordmark-color, var(--color-logo-wordmark-inverse))">
+  <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+    <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+    <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+    <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+    <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+    <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+    <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+    <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+    <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+    <rect x="7.1" y="95.71" width="5.84" height="5.48" />
   </g>
-  <g>
-    <path class="cls-2" d="M121.28,25.08v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V25.08h5.83Z"/>
-    <path class="cls-2" d="M168.53,25.08v6.26h-5.83v-6.26h5.83ZM168.53,42.64v41.27h-5.83v-41.27h5.83Z"/>
-    <path class="cls-2" d="M191.36,25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82v-17.16h5.83Z"/>
-    <path class="cls-2" d="M212.88,42.24l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-    <path class="cls-2" d="M264.05,25.08v6.26h-5.83v-6.26h5.83ZM264.05,42.24v41.67h-5.83v-41.67h5.83Z"/>
-    <path class="cls-2" d="M311.21,25.08v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V25.08h5.83Z"/>
+  <g fill="currentColor">
+    <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+    <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+    <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+    <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+    <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+    <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/assets/svg/bitvid-logo-light-mode.svg b/assets/svg/bitvid-logo-light-mode.svg
index 6d02a409..492ff914 100644
--- a/assets/svg/bitvid-logo-light-mode.svg
+++ b/assets/svg/bitvid-logo-light-mode.svg
@@ -1,33 +1,21 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-
-      .cls-2 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <g>
-    <rect class="cls-1" x="7.1" y="7.8" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="18.78" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="29.77" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="40.76" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="51.75" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="62.74" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="73.73" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="84.72" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="95.71" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98" color="var(--logo-wordmark-color, var(--color-logo-wordmark))">
+  <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+    <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+    <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+    <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+    <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+    <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+    <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+    <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+    <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+    <rect x="7.1" y="95.71" width="5.84" height="5.48" />
   </g>
-  <g>
-    <path class="cls-2" d="M121.28,25.08v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V25.08h5.83Z"/>
-    <path class="cls-2" d="M168.53,25.08v6.26h-5.83v-6.26h5.83ZM168.53,42.64v41.27h-5.83v-41.27h5.83Z"/>
-    <path class="cls-2" d="M191.36,25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82v-17.16h5.83Z"/>
-    <path class="cls-2" d="M212.88,42.24l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-    <path class="cls-2" d="M264.05,25.08v6.26h-5.83v-6.26h5.83ZM264.05,42.24v41.67h-5.83v-41.67h5.83Z"/>
-    <path class="cls-2" d="M311.21,25.08v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V25.08h5.83Z"/>
+  <g fill="currentColor">
+    <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+    <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+    <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+    <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+    <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+    <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/beacon-icon.svg b/bitvid_logo/beacon-icon.svg
index 75d620cb..235cdc5d 100644
--- a/bitvid_logo/beacon-icon.svg
+++ b/bitvid_logo/beacon-icon.svg
@@ -1,7 +1,5 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <g transform="matrix(0.0349343,0,0,0.0349343,-55.5414,-28.6416)">
-        <path d="M1878.62,1496.58C1719.5,1470.41 1597.95,1332.09 1597.95,1165.6C1597.95,980.47 1748.25,830.166 1933.38,830.166C2118.51,830.166 2268.82,980.47 2268.82,1165.6C2268.82,1331.86 2147.6,1470.03 1988.8,1496.47L1988.8,1466.79C2131.38,1440.68 2239.59,1315.68 2239.59,1165.6C2239.59,996.604 2102.38,859.399 1933.38,859.399C1764.39,859.399 1627.18,996.604 1627.18,1165.6C1627.18,1315.91 1735.72,1441.07 1878.62,1466.91L1878.62,1496.58ZM1878.62,1400.68C1771.77,1375.85 1692.06,1279.96 1692.06,1165.6C1692.06,1032.41 1800.19,924.274 1933.38,924.274C2066.57,924.274 2174.71,1032.41 2174.71,1165.6C2174.71,1279.73 2095.32,1375.46 1988.8,1400.53L1988.8,1370.37C2079.02,1345.98 2145.48,1263.49 2145.48,1165.6C2145.48,1048.54 2050.44,953.507 1933.38,953.507C1816.33,953.507 1721.29,1048.54 1721.29,1165.6C1721.29,1263.73 1788.07,1346.38 1878.62,1370.55L1878.62,1400.68ZM1878.62,1304.01C1823.55,1282.18 1784.56,1228.41 1784.56,1165.6C1784.56,1083.46 1851.24,1016.77 1933.38,1016.77C2015.52,1016.77 2082.21,1083.46 2082.21,1165.6C2082.21,1228.16 2043.53,1281.76 1988.8,1303.75L1988.8,1271.59C2026.93,1251.59 2052.98,1211.62 2052.98,1165.6C2052.98,1099.6 1999.39,1046.01 1933.38,1046.01C1867.38,1046.01 1813.79,1099.6 1813.79,1165.6C1813.79,1211.88 1840.13,1252.05 1878.62,1271.93L1878.62,1304.01ZM1933.38,1109.82C1964.17,1109.82 1989.16,1134.82 1989.16,1165.6C1989.16,1196.39 1964.17,1221.38 1933.38,1221.38C1902.6,1221.38 1877.6,1196.39 1877.6,1165.6C1877.6,1134.82 1902.6,1109.82 1933.38,1109.82Z" fill="#5C6F8A"/>
-    </g>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+  <g transform="matrix(0.0349343 0 0 0.0349343 -55.5414 -28.6416)">
+    <path d="M1878.62 1496.58c-159.12-26.17-280.67-164.49-280.67-330.98 0-185.13 150.3-335.43 335.43-335.43s335.44 150.3 335.44 335.43c0 166.26-121.22 304.43-280.02 330.87v-29.68c142.58-26.11 250.79-151.11 250.8-301.19 0-169-137.21-306.21-306.21-306.21s-306.2 137.21-306.2 306.21c0 150.31 108.54 275.47 251.44 301.33v29.73Zm0-95.9c-106.85-24.83-186.56-120.72-186.56-235.08 0-133.19 108.13-241.33 241.32-241.33s241.33 108.14 241.33 241.33c0 113.13-79.39 208.86-185.91 233.93v-30.16c90.22-24.39 156.68-106.88 156.68-204.77 0-117.06-97.12-214.22-214.18-214.22s-214.18 97.12-214.18 214.22c0 97.13 66.78 179.78 157.33 203.95v32.08Zm0-96.67c-55.07-21.83-94.06-75.6-94.06-138.41 0-82.14 66.68-148.83 148.82-148.83s148.83 66.69 148.83 148.83c0 62.56-38.68 116.16-93.41 138.15v-32.16c38.13-20 64.18-59.97 64.18-106 0-66 53.59-119.59 119.6-119.59s119.59 53.59 119.59 119.59c0 46.28-26.34 86.45-64.83 106.33v32.08c-55.07 21.83-94.06 75.6-94.06 138.41 0 82.14 66.68 148.83 148.82 148.83s148.83-66.69 148.83-148.83c0-62.6-38.68-116.2-93.41-138.19v-32.08c38.13-20 64.18-59.97 64.18-106 0-66-53.59-119.59-119.6-119.59s-119.59 53.59-119.59 119.59c0 46.28 26.34 86.45 64.83 106.33v32.08c-55.07 21.83-94.06 75.6-94.06 138.41 0 82.14 66.68 148.83 148.82 148.83s148.83-66.69 148.83-148.83c0-62.56-38.68-116.16-93.41-138.15v-32.16c38.13-20 64.18-59.97 64.18-106 0-66-53.59-119.59-119.6-119.59s-119.59 53.59-119.59 119.59c0 46.28 26.34 86.45 64.83 106.33v32.08Z" />
+  </g>
 </svg>
diff --git a/bitvid_logo/bitvid-01.svg b/bitvid_logo/bitvid-01.svg
index 425fca71..11292425 100644
--- a/bitvid_logo/bitvid-01.svg
+++ b/bitvid_logo/bitvid-01.svg
@@ -1,29 +1,21 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <g>
-    <rect class="cls-1" x="7.1" y="7.8" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="18.78" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="29.77" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="40.76" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="51.75" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="62.74" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="73.73" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="84.72" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="95.71" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98" color="var(--logo-wordmark-color, var(--color-logo-wordmark))">
+  <g fill="var(--logo-accent-color, currentColor)">
+    <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+    <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+    <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+    <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+    <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+    <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+    <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+    <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+    <rect x="7.1" y="95.71" width="5.84" height="5.48" />
   </g>
-  <g>
-    <path class="cls-1" d="M121.28,25.08v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V25.08h5.83Z"/>
-    <path class="cls-1" d="M168.53,25.08v6.26h-5.83v-6.26h5.83ZM168.53,42.64v41.27h-5.83v-41.27h5.83Z"/>
-    <path class="cls-1" d="M191.36,25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82v-17.16h5.83Z"/>
-    <path class="cls-1" d="M212.88,42.24l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-    <path class="cls-1" d="M264.05,25.08v6.26h-5.83v-6.26h5.83ZM264.05,42.24v41.67h-5.83v-41.67h5.83Z"/>
-    <path class="cls-1" d="M311.21,25.08v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V25.08h5.83Z"/>
+  <g fill="currentColor">
+    <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+    <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+    <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+    <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+    <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+    <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-02.svg b/bitvid_logo/bitvid-02.svg
index 49ae1b6c..530b643a 100644
--- a/bitvid_logo/bitvid-02.svg
+++ b/bitvid_logo/bitvid-02.svg
@@ -1,29 +1,21 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fff;
-      }
-    </style>
-  </defs>
-  <g>
-    <rect class="cls-1" x="7.1" y="7.8" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="18.78" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="29.77" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="40.76" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="51.75" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="62.74" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="73.73" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="84.72" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="95.71" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98" color="var(--logo-wordmark-color, var(--color-logo-wordmark-inverse))">
+  <g fill="var(--logo-accent-color, currentColor)">
+    <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+    <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+    <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+    <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+    <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+    <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+    <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+    <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+    <rect x="7.1" y="95.71" width="5.84" height="5.48" />
   </g>
-  <g>
-    <path class="cls-1" d="M121.28,25.08v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V25.08h5.83Z"/>
-    <path class="cls-1" d="M168.53,25.08v6.26h-5.83v-6.26h5.83ZM168.53,42.64v41.27h-5.83v-41.27h5.83Z"/>
-    <path class="cls-1" d="M191.36,25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82v-17.16h5.83Z"/>
-    <path class="cls-1" d="M212.88,42.24l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-    <path class="cls-1" d="M264.05,25.08v6.26h-5.83v-6.26h5.83ZM264.05,42.24v41.67h-5.83v-41.67h5.83Z"/>
-    <path class="cls-1" d="M311.21,25.08v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V25.08h5.83Z"/>
+  <g fill="currentColor">
+    <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+    <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+    <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+    <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+    <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+    <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-03.svg b/bitvid_logo/bitvid-03.svg
index 6d02a409..492ff914 100644
--- a/bitvid_logo/bitvid-03.svg
+++ b/bitvid_logo/bitvid-03.svg
@@ -1,33 +1,21 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-
-      .cls-2 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <g>
-    <rect class="cls-1" x="7.1" y="7.8" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="18.78" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="29.77" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="40.76" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="51.75" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="62.74" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="73.73" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="84.72" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="95.71" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98" color="var(--logo-wordmark-color, var(--color-logo-wordmark))">
+  <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+    <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+    <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+    <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+    <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+    <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+    <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+    <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+    <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+    <rect x="7.1" y="95.71" width="5.84" height="5.48" />
   </g>
-  <g>
-    <path class="cls-2" d="M121.28,25.08v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V25.08h5.83Z"/>
-    <path class="cls-2" d="M168.53,25.08v6.26h-5.83v-6.26h5.83ZM168.53,42.64v41.27h-5.83v-41.27h5.83Z"/>
-    <path class="cls-2" d="M191.36,25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82v-17.16h5.83Z"/>
-    <path class="cls-2" d="M212.88,42.24l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-    <path class="cls-2" d="M264.05,25.08v6.26h-5.83v-6.26h5.83ZM264.05,42.24v41.67h-5.83v-41.67h5.83Z"/>
-    <path class="cls-2" d="M311.21,25.08v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V25.08h5.83Z"/>
+  <g fill="currentColor">
+    <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+    <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+    <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+    <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+    <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+    <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-04.svg b/bitvid_logo/bitvid-04.svg
index 4cded503..45b67504 100644
--- a/bitvid_logo/bitvid-04.svg
+++ b/bitvid_logo/bitvid-04.svg
@@ -1,33 +1,21 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-
-      .cls-2 {
-        fill: #fff;
-      }
-    </style>
-  </defs>
-  <g>
-    <rect class="cls-1" x="7.1" y="7.8" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="18.78" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="29.77" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="40.76" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="51.75" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="62.74" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="73.73" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="84.72" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="7.1" y="95.71" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 318.32 108.98" color="var(--logo-wordmark-color, var(--color-logo-wordmark-inverse))">
+  <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+    <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+    <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+    <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+    <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+    <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+    <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+    <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+    <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+    <rect x="7.1" y="95.71" width="5.84" height="5.48" />
   </g>
-  <g>
-    <path class="cls-2" d="M121.28,25.08v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V25.08h5.83Z"/>
-    <path class="cls-2" d="M168.53,25.08v6.26h-5.83v-6.26h5.83ZM168.53,42.64v41.27h-5.83v-41.27h5.83Z"/>
-    <path class="cls-2" d="M191.36,25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82v-17.16h5.83Z"/>
-    <path class="cls-2" d="M212.88,42.24l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-    <path class="cls-2" d="M264.05,25.08v6.26h-5.83v-6.26h5.83ZM264.05,42.24v41.67h-5.83v-41.67h5.83Z"/>
-    <path class="cls-2" d="M311.21,25.08v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V25.08h5.83Z"/>
+  <g fill="currentColor">
+    <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+    <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+    <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+    <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+    <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+    <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-05.svg b/bitvid_logo/bitvid-05.svg
index 1a9f2449..cda3f674 100644
--- a/bitvid_logo/bitvid-05.svg
+++ b/bitvid_logo/bitvid-05.svg
@@ -1,19 +1,13 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.46 112.46">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fff;
-      }
-    </style>
-  </defs>
-  <rect class="cls-1" x="15.79" y="9.53" width="5.84" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="20.52" width="24.02" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="31.51" width="42.85" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="42.5" width="61.68" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="53.49" width="80.88" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="64.48" width="61.68" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="75.47" width="42.85" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="86.45" width="24.02" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="97.44" width="5.84" height="5.48"/>
-</svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.46 112.46">
+  <g fill="var(--logo-accent-color, var(--color-logo-wordmark-inverse))">
+    <rect x="15.79" y="9.53" width="5.84" height="5.48" />
+    <rect x="15.79" y="20.52" width="24.02" height="5.48" />
+    <rect x="15.79" y="31.51" width="42.85" height="5.48" />
+    <rect x="15.79" y="42.5" width="61.68" height="5.48" />
+    <rect x="15.79" y="53.49" width="80.88" height="5.48" />
+    <rect x="15.79" y="64.48" width="61.68" height="5.48" />
+    <rect x="15.79" y="75.47" width="42.85" height="5.48" />
+    <rect x="15.79" y="86.45" width="24.02" height="5.48" />
+    <rect x="15.79" y="97.44" width="5.84" height="5.48" />
+  </g>
+</svg>
diff --git a/bitvid_logo/bitvid-06.svg b/bitvid_logo/bitvid-06.svg
index 900cdef0..e97b30e8 100644
--- a/bitvid_logo/bitvid-06.svg
+++ b/bitvid_logo/bitvid-06.svg
@@ -1,19 +1,13 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.46 112.46">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <rect class="cls-1" x="15.79" y="9.53" width="5.84" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="20.52" width="24.02" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="31.51" width="42.85" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="42.5" width="61.68" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="53.49" width="80.88" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="64.48" width="61.68" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="75.47" width="42.85" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="86.45" width="24.02" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="97.44" width="5.84" height="5.48"/>
-</svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.46 112.46">
+  <g fill="var(--logo-accent-color, var(--color-logo-wordmark))">
+    <rect x="15.79" y="9.53" width="5.84" height="5.48" />
+    <rect x="15.79" y="20.52" width="24.02" height="5.48" />
+    <rect x="15.79" y="31.51" width="42.85" height="5.48" />
+    <rect x="15.79" y="42.5" width="61.68" height="5.48" />
+    <rect x="15.79" y="53.49" width="80.88" height="5.48" />
+    <rect x="15.79" y="64.48" width="61.68" height="5.48" />
+    <rect x="15.79" y="75.47" width="42.85" height="5.48" />
+    <rect x="15.79" y="86.45" width="24.02" height="5.48" />
+    <rect x="15.79" y="97.44" width="5.84" height="5.48" />
+  </g>
+</svg>
diff --git a/bitvid_logo/bitvid-07.svg b/bitvid_logo/bitvid-07.svg
index 18d3b96f..74159d6e 100644
--- a/bitvid_logo/bitvid-07.svg
+++ b/bitvid_logo/bitvid-07.svg
@@ -1,19 +1,13 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.46 112.46">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-    </style>
-  </defs>
-  <rect class="cls-1" x="15.79" y="9.53" width="5.84" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="20.52" width="24.02" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="31.51" width="42.85" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="42.5" width="61.68" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="53.49" width="80.88" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="64.48" width="61.68" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="75.47" width="42.85" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="86.45" width="24.02" height="5.48"/>
-  <rect class="cls-1" x="15.79" y="97.44" width="5.84" height="5.48"/>
-</svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 112.46 112.46">
+  <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+    <rect x="15.79" y="9.53" width="5.84" height="5.48" />
+    <rect x="15.79" y="20.52" width="24.02" height="5.48" />
+    <rect x="15.79" y="31.51" width="42.85" height="5.48" />
+    <rect x="15.79" y="42.5" width="61.68" height="5.48" />
+    <rect x="15.79" y="53.49" width="80.88" height="5.48" />
+    <rect x="15.79" y="64.48" width="61.68" height="5.48" />
+    <rect x="15.79" y="75.47" width="42.85" height="5.48" />
+    <rect x="15.79" y="86.45" width="24.02" height="5.48" />
+    <rect x="15.79" y="97.44" width="5.84" height="5.48" />
+  </g>
+</svg>
diff --git a/bitvid_logo/bitvid-08.svg b/bitvid_logo/bitvid-08.svg
index 82936032..e360e413 100644
--- a/bitvid_logo/bitvid-08.svg
+++ b/bitvid_logo/bitvid-08.svg
@@ -1,16 +1,8 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 229.82 88">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <path class="cls-1" d="M22.86,14.59v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V14.59h5.83Z"/>
-  <path class="cls-1" d="M70.11,14.59v6.26h-5.83v-6.26h5.83ZM70.11,32.15v41.27h-5.83v-41.27h5.83Z"/>
-  <path class="cls-1" d="M92.94,14.59v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V14.59h5.83Z"/>
-  <path class="cls-1" d="M114.46,31.75l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-  <path class="cls-1" d="M165.63,14.59v6.26h-5.83v-6.26h5.83ZM165.63,31.75v41.67h-5.83V31.75h5.83Z"/>
-  <path class="cls-1" d="M212.79,14.59v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V14.59h5.83Z"/>
-</svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 229.82 88" fill="currentColor" color="var(--logo-wordmark-color, var(--color-logo-wordmark))">
+  <path d="M22.86 14.59v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V14.59h5.83Z" />
+  <path d="M70.11 14.59v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+  <path d="M92.94 14.59v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V14.59h5.83Z" />
+  <path d="M114.46 31.75l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+  <path d="M165.63 14.59v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83V31.75h5.83Z" />
+  <path d="M212.79 14.59v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V14.59h5.83Z" />
+</svg>
diff --git a/bitvid_logo/bitvid-09.svg b/bitvid_logo/bitvid-09.svg
index 24a3bdf8..20f1a9f2 100644
--- a/bitvid_logo/bitvid-09.svg
+++ b/bitvid_logo/bitvid-09.svg
@@ -1,16 +1,8 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 229.82 88">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-    </style>
-  </defs>
-  <path class="cls-1" d="M22.86,14.59v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V14.59h5.83Z"/>
-  <path class="cls-1" d="M70.11,14.59v6.26h-5.83v-6.26h5.83ZM70.11,32.15v41.27h-5.83v-41.27h5.83Z"/>
-  <path class="cls-1" d="M92.94,14.59v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V14.59h5.83Z"/>
-  <path class="cls-1" d="M114.46,31.75l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-  <path class="cls-1" d="M165.63,14.59v6.26h-5.83v-6.26h5.83ZM165.63,31.75v41.67h-5.83V31.75h5.83Z"/>
-  <path class="cls-1" d="M212.79,14.59v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V14.59h5.83Z"/>
-</svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 229.82 88" fill="currentColor" color="var(--logo-wordmark-color, var(--color-logo-accent))">
+  <path d="M22.86 14.59v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V14.59h5.83Z" />
+  <path d="M70.11 14.59v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+  <path d="M92.94 14.59v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V14.59h5.83Z" />
+  <path d="M114.46 31.75l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+  <path d="M165.63 14.59v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83V31.75h5.83Z" />
+  <path d="M212.79 14.59v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V14.59h5.83Z" />
+</svg>
diff --git a/bitvid_logo/bitvid-10.svg b/bitvid_logo/bitvid-10.svg
index b44c9f7d..ae7d211c 100644
--- a/bitvid_logo/bitvid-10.svg
+++ b/bitvid_logo/bitvid-10.svg
@@ -1,16 +1,8 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 229.82 88">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fff;
-      }
-    </style>
-  </defs>
-  <path class="cls-1" d="M22.86,14.59v44.54c0,5.67,2.79,8.54,8.22,8.54h11.57c5.51,0,8.3-2.87,8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7,0,13.01,4.47,13.01,13.33v15.01c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33V14.59h5.83Z"/>
-  <path class="cls-1" d="M70.11,14.59v6.26h-5.83v-6.26h5.83ZM70.11,32.15v41.27h-5.83v-41.27h5.83Z"/>
-  <path class="cls-1" d="M92.94,14.59v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V14.59h5.83Z"/>
-  <path class="cls-1" d="M114.46,31.75l16.84,35.68,16.6-35.68h6.07l-19.56,41.67h-6.31l-20.04-41.67h6.39Z"/>
-  <path class="cls-1" d="M165.63,14.59v6.26h-5.83v-6.26h5.83ZM165.63,31.75v41.67h-5.83V31.75h5.83Z"/>
-  <path class="cls-1" d="M212.79,14.59v45.5c0,8.86-4.31,13.33-13.01,13.33h-13.73c-8.7,0-13.01-4.47-13.01-13.33v-15.01c0-8.86,4.31-13.33,13.01-13.33h17.72v5.83h-16.6c-5.51,0-8.3,2.79-8.3,8.46v13.09c0,5.67,2.79,8.54,8.3,8.54h11.49c5.51,0,8.3-2.87,8.3-8.54V14.59h5.83Z"/>
-</svg>
\ No newline at end of file
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 229.82 88" fill="currentColor" color="var(--logo-wordmark-color, var(--color-logo-wordmark-inverse))">
+  <path d="M22.86 14.59v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V14.59h5.83Z" />
+  <path d="M70.11 14.59v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+  <path d="M92.94 14.59v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V14.59h5.83Z" />
+  <path d="M114.46 31.75l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+  <path d="M165.63 14.59v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83V31.75h5.83Z" />
+  <path d="M212.79 14.59v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V14.59h5.83Z" />
+</svg>
diff --git a/bitvid_logo/bitvid-11.svg b/bitvid_logo/bitvid-11.svg
index a3b6f399..34104318 100644
--- a/bitvid_logo/bitvid-11.svg
+++ b/bitvid_logo/bitvid-11.svg
@@ -1,26 +1,14 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-
-      .cls-2 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <rect class="cls-2" width="196.27" height="196.27"/>
-  <g>
-    <rect class="cls-1" x="67.7" y="51.44" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="62.43" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="73.41" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="84.4" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="95.39" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="106.38" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="117.37" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="128.36" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="139.35" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
+  <rect width="196.27" height="196.27" fill="var(--logo-background-color, var(--color-logo-background))" />
+  <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+    <rect x="67.7" y="51.44" width="5.84" height="5.48" />
+    <rect x="67.7" y="62.43" width="24.02" height="5.48" />
+    <rect x="67.7" y="73.41" width="42.85" height="5.48" />
+    <rect x="67.7" y="84.4" width="61.68" height="5.48" />
+    <rect x="67.7" y="95.39" width="80.88" height="5.48" />
+    <rect x="67.7" y="106.38" width="61.68" height="5.48" />
+    <rect x="67.7" y="117.36" width="42.85" height="5.48" />
+    <rect x="67.7" y="128.35" width="24.02" height="5.48" />
+    <rect x="67.7" y="139.34" width="5.84" height="5.48" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-12.svg b/bitvid_logo/bitvid-12.svg
index 87940c1d..bdb1e528 100644
--- a/bitvid_logo/bitvid-12.svg
+++ b/bitvid_logo/bitvid-12.svg
@@ -1,26 +1,14 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fff;
-      }
-
-      .cls-2 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <rect class="cls-2" width="196.27" height="196.27"/>
-  <g>
-    <rect class="cls-1" x="67.7" y="51.44" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="62.43" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="73.41" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="84.4" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="95.39" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="106.38" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="117.37" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="128.36" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="139.35" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
+  <rect width="196.27" height="196.27" fill="var(--logo-background-color, var(--color-logo-background))" />
+  <g fill="var(--logo-accent-color, var(--color-logo-wordmark-inverse))">
+    <rect x="67.7" y="51.44" width="5.84" height="5.48" />
+    <rect x="67.7" y="62.43" width="24.02" height="5.48" />
+    <rect x="67.7" y="73.41" width="42.85" height="5.48" />
+    <rect x="67.7" y="84.4" width="61.68" height="5.48" />
+    <rect x="67.7" y="95.39" width="80.88" height="5.48" />
+    <rect x="67.7" y="106.38" width="61.68" height="5.48" />
+    <rect x="67.7" y="117.36" width="42.85" height="5.48" />
+    <rect x="67.7" y="128.35" width="24.02" height="5.48" />
+    <rect x="67.7" y="139.34" width="5.84" height="5.48" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-13.svg b/bitvid_logo/bitvid-13.svg
index 78e5ddf6..6fecb9f1 100644
--- a/bitvid_logo/bitvid-13.svg
+++ b/bitvid_logo/bitvid-13.svg
@@ -1,26 +1,14 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-
-      .cls-2 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <rect class="cls-1" width="196.27" height="196.27"/>
-  <g>
-    <rect class="cls-2" x="67.7" y="51.44" width="5.84" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="62.43" width="24.02" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="73.41" width="42.85" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="84.4" width="61.68" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="95.39" width="80.88" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="106.38" width="61.68" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="117.37" width="42.85" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="128.36" width="24.02" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="139.35" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
+  <rect width="196.27" height="196.27" fill="var(--logo-background-color, var(--color-logo-accent))" />
+  <g fill="var(--logo-wordmark-color, var(--color-logo-wordmark))">
+    <rect x="67.7" y="51.44" width="5.84" height="5.48" />
+    <rect x="67.7" y="62.43" width="24.02" height="5.48" />
+    <rect x="67.7" y="73.41" width="42.85" height="5.48" />
+    <rect x="67.7" y="84.4" width="61.68" height="5.48" />
+    <rect x="67.7" y="95.39" width="80.88" height="5.48" />
+    <rect x="67.7" y="106.38" width="61.68" height="5.48" />
+    <rect x="67.7" y="117.36" width="42.85" height="5.48" />
+    <rect x="67.7" y="128.35" width="24.02" height="5.48" />
+    <rect x="67.7" y="139.34" width="5.84" height="5.48" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-14.svg b/bitvid_logo/bitvid-14.svg
index 647fa16c..824c7330 100644
--- a/bitvid_logo/bitvid-14.svg
+++ b/bitvid_logo/bitvid-14.svg
@@ -1,26 +1,14 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-
-      .cls-2 {
-        fill: #fff;
-      }
-    </style>
-  </defs>
-  <rect class="cls-1" width="196.27" height="196.27"/>
-  <g>
-    <rect class="cls-2" x="67.7" y="51.44" width="5.84" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="62.43" width="24.02" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="73.41" width="42.85" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="84.4" width="61.68" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="95.39" width="80.88" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="106.38" width="61.68" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="117.37" width="42.85" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="128.36" width="24.02" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="139.35" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
+  <rect width="196.27" height="196.27" fill="var(--logo-background-color, var(--color-logo-accent))" />
+  <g fill="var(--logo-wordmark-color, var(--color-logo-wordmark-inverse))">
+    <rect x="67.7" y="51.44" width="5.84" height="5.48" />
+    <rect x="67.7" y="62.43" width="24.02" height="5.48" />
+    <rect x="67.7" y="73.41" width="42.85" height="5.48" />
+    <rect x="67.7" y="84.4" width="61.68" height="5.48" />
+    <rect x="67.7" y="95.39" width="80.88" height="5.48" />
+    <rect x="67.7" y="106.38" width="61.68" height="5.48" />
+    <rect x="67.7" y="117.36" width="42.85" height="5.48" />
+    <rect x="67.7" y="128.35" width="24.02" height="5.48" />
+    <rect x="67.7" y="139.34" width="5.84" height="5.48" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-15.svg b/bitvid_logo/bitvid-15.svg
index 9957fdcf..31a4eb3b 100644
--- a/bitvid_logo/bitvid-15.svg
+++ b/bitvid_logo/bitvid-15.svg
@@ -1,26 +1,14 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fff;
-      }
-
-      .cls-2 {
-        fill: #383838;
-      }
-    </style>
-  </defs>
-  <rect class="cls-1" width="196.27" height="196.27"/>
-  <g>
-    <rect class="cls-2" x="67.7" y="51.44" width="5.84" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="62.43" width="24.02" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="73.41" width="42.85" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="84.4" width="61.68" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="95.39" width="80.88" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="106.38" width="61.68" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="117.37" width="42.85" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="128.36" width="24.02" height="5.48"/>
-    <rect class="cls-2" x="67.7" y="139.35" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
+  <rect width="196.27" height="196.27" fill="var(--logo-background-color, var(--color-logo-background-inverse))" />
+  <g fill="var(--logo-wordmark-color, var(--color-logo-wordmark))">
+    <rect x="67.7" y="51.44" width="5.84" height="5.48" />
+    <rect x="67.7" y="62.43" width="24.02" height="5.48" />
+    <rect x="67.7" y="73.41" width="42.85" height="5.48" />
+    <rect x="67.7" y="84.4" width="61.68" height="5.48" />
+    <rect x="67.7" y="95.39" width="80.88" height="5.48" />
+    <rect x="67.7" y="106.38" width="61.68" height="5.48" />
+    <rect x="67.7" y="117.36" width="42.85" height="5.48" />
+    <rect x="67.7" y="128.35" width="24.02" height="5.48" />
+    <rect x="67.7" y="139.34" width="5.84" height="5.48" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/bitvid-16.svg b/bitvid_logo/bitvid-16.svg
index 7ac97998..1f65e5fc 100644
--- a/bitvid_logo/bitvid-16.svg
+++ b/bitvid_logo/bitvid-16.svg
@@ -1,26 +1,14 @@
-<?xml version="1.0" encoding="UTF-8"?>
-<svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
-  <defs>
-    <style>
-      .cls-1 {
-        fill: #fe0032;
-      }
-
-      .cls-2 {
-        fill: #fff;
-      }
-    </style>
-  </defs>
-  <rect class="cls-2" width="196.27" height="196.27"/>
-  <g>
-    <rect class="cls-1" x="67.7" y="51.44" width="5.84" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="62.43" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="73.41" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="84.4" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="95.39" width="80.88" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="106.38" width="61.68" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="117.37" width="42.85" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="128.36" width="24.02" height="5.48"/>
-    <rect class="cls-1" x="67.7" y="139.35" width="5.84" height="5.48"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 196.27 196.27">
+  <rect width="196.27" height="196.27" fill="var(--logo-background-color, var(--color-logo-background-inverse))" />
+  <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+    <rect x="67.7" y="51.44" width="5.84" height="5.48" />
+    <rect x="67.7" y="62.43" width="24.02" height="5.48" />
+    <rect x="67.7" y="73.41" width="42.85" height="5.48" />
+    <rect x="67.7" y="84.4" width="61.68" height="5.48" />
+    <rect x="67.7" y="95.39" width="80.88" height="5.48" />
+    <rect x="67.7" y="106.38" width="61.68" height="5.48" />
+    <rect x="67.7" y="117.36" width="42.85" height="5.48" />
+    <rect x="67.7" y="128.35" width="24.02" height="5.48" />
+    <rect x="67.7" y="139.34" width="5.84" height="5.48" />
   </g>
-</svg>
\ No newline at end of file
+</svg>
diff --git a/bitvid_logo/dns-icon.svg b/bitvid_logo/dns-icon.svg
index b8fe2ba0..c5f9978f 100644
--- a/bitvid_logo/dns-icon.svg
+++ b/bitvid_logo/dns-icon.svg
@@ -1,5 +1,3 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <path d="M12,0C18.623,0 24,5.377 24,12C24,18.623 18.623,24 12,24C5.377,24 0,18.623 0,12C0,5.377 5.377,0 12,0M14.557,16L9.442,16C9.988,18.46 10.883,20.114 12,21.744C13.194,20.003 14.041,18.334 14.557,16M7.4,16L2.833,16C4.069,18.825 6.537,20.972 9.588,21.716C8.54,19.983 7.805,18.058 7.4,16M21.167,16L16.6,16C16.209,17.988 15.505,19.887 14.425,21.694C17.437,20.931 19.942,18.799 21.167,16M7.162,10L2.2,10C1.933,11.313 1.933,12.685 2.2,14L7.115,14C6.996,12.671 7.014,11.328 7.162,10M14.823,10L9.176,10C9.011,11.326 8.991,12.672 9.123,14L14.876,14C15.009,12.672 14.987,11.327 14.823,10M21.8,10L16.837,10C16.985,11.328 17.003,12.671 16.885,14L21.8,14C22.06,12.715 22.073,11.352 21.8,10M9.644,2.271C6.567,3.003 4.077,5.157 2.833,8L7.486,8C7.921,5.958 8.664,4.015 9.644,2.271M11.999,2.223C10.91,3.993 10.089,5.676 9.536,8L14.463,8C13.929,5.754 13.126,4.052 11.999,2.223M14.367,2.292C15.38,4.104 16.1,6.052 16.513,8L21.167,8C19.935,5.184 17.405,3.042 14.367,2.292" fill="#5C6F8A"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
+  <path d="M12 0C18.623 0 24 5.377 24 12c0 6.623-5.377 12-12 12S0 18.623 0 12 5.377 0 12 0Zm2.557 16H9.442c.546 2.46 1.441 4.114 2.558 5.744 1.194-1.741 2.041-3.41 2.557-5.744ZM7.4 16H2.833c1.236 2.825 3.704 4.972 6.755 5.716-.048-1.733-.783-3.658-1.188-5.716Zm13.767 0H16.6c-.391 1.988-1.095 3.887-2.175 5.694 3.012-.763 5.517-2.895 6.742-5.694ZM7.162 10H2.2a7.996 7.996 0 0 0 0 4h4.915a22.266 22.266 0 0 1 .047-4Zm7.661 0H9.176a22.238 22.238 0 0 0-.053 4h5.753a22.238 22.238 0 0 0-.053-4Zm6.638 0h-4.963a22.266 22.266 0 0 1 .048 4H21.8a7.99 7.99 0 0 0-.342-4ZM9.644 2.271A11.996 11.996 0 0 0 2.833 8h4.653c.435-2.042 1.178-3.985 2.158-5.729ZM12 2.223c-1.089 1.77-1.91 3.453-2.463 5.777h4.927C13.93 5.754 13.127 4.052 12 2.223Zm2.368.069C15.38 4.104 16.1 6.052 16.513 8h4.654a11.995 11.995 0 0 0-6.799-5.708Z"/>
 </svg>
diff --git a/bitvid_logo/guidelines-icon.svg b/bitvid_logo/guidelines-icon.svg
index 81bf5bda..f57ed171 100644
--- a/bitvid_logo/guidelines-icon.svg
+++ b/bitvid_logo/guidelines-icon.svg
@@ -1,5 +1,3 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <path d="M23.334,11.96C22.621,11.234 22.462,10.131 22.941,9.233C23.283,8.593 23.307,7.832 23.005,7.171C22.704,6.511 22.112,6.029 21.404,5.869C20.413,5.644 19.682,4.802 19.601,3.788C19.542,3.065 19.15,2.41 18.539,2.018C17.93,1.625 17.172,1.54 16.489,1.789C15.533,2.136 14.463,1.821 13.847,1.013C13.407,0.437 12.723,0.098 11.997,0.098C11.272,0.098 10.588,0.437 10.148,1.013C9.535,1.822 8.465,2.137 7.509,1.79C6.827,1.542 6.069,1.627 5.459,2.019C4.849,2.411 4.456,3.066 4.398,3.789C4.316,4.803 3.586,5.646 2.595,5.87C1.887,6.03 1.295,6.512 0.994,7.172C0.693,7.832 0.717,8.594 1.059,9.233C1.538,10.13 1.379,11.234 0.667,11.96C0.158,12.477 -0.08,13.202 0.023,13.92C0.126,14.638 0.559,15.267 1.193,15.62C2.081,16.115 2.545,17.13 2.337,18.125C2.19,18.835 2.381,19.573 2.856,20.121C3.332,20.67 4.036,20.965 4.758,20.919C5.774,20.856 6.711,21.459 7.075,22.408C7.334,23.086 7.895,23.603 8.592,23.807C9.287,24.011 10.039,23.879 10.623,23.45C11.442,22.847 12.559,22.847 13.377,23.45C13.961,23.88 14.713,24.012 15.408,23.807C16.105,23.603 16.666,23.085 16.926,22.408C17.289,21.459 18.227,20.855 19.242,20.919C19.966,20.965 20.669,20.67 21.144,20.121C21.619,19.573 21.811,18.835 21.663,18.125C21.456,17.13 21.919,16.115 22.808,15.62C23.441,15.266 23.873,14.638 23.977,13.92C24.081,13.202 23.842,12.477 23.334,11.96ZM10.75,17.39L6.25,13.026L8.107,11.169L10.75,13.675L16.393,7.891L18.25,9.748L10.75,17.39Z" fill="#5C6F8A" fill-rule="nonzero"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" fill-rule="nonzero">
+  <path d="M23.334 11.96C22.621 11.234 22.462 10.131 22.941 9.233C23.283 8.593 23.307 7.832 23.005 7.171C22.704 6.511 22.112 6.029 21.404 5.869C20.413 5.644 19.682 4.802 19.601 3.788C19.542 3.065 19.15 2.41 18.539 2.018C17.93 1.625 17.172 1.54 16.489 1.789C15.533 2.136 14.463 1.821 13.847 1.013C13.407 0.437 12.723 0.098 11.997 0.098C11.272 0.098 10.588 0.437 10.148 1.013C9.535 1.822 8.465 2.137 7.509 1.79C6.827 1.542 6.069 1.627 5.459 2.019C4.849 2.411 4.456 3.066 4.398 3.789C4.316 4.803 3.586 5.646 2.595 5.87C1.887 6.03 1.295 6.512 0.994 7.172C0.693 7.832 0.717 8.594 1.059 9.233C1.538 10.13 1.379 11.234 0.667 11.96C0.158 12.477 -0.08 13.202 0.023 13.92C0.126 14.638 0.559 15.267 1.193 15.62C2.081 16.115 2.545 17.13 2.337 18.125C2.19 18.835 2.381 19.573 2.856 20.121C3.332 20.67 4.036 20.965 4.758 20.919C5.774 20.856 6.711 21.459 7.075 22.408C7.334 23.086 7.895 23.603 8.592 23.807C9.287 24.011 10.039 23.879 10.623 23.45C11.442 22.847 12.559 22.847 13.377 23.45C13.961 23.88 14.713 24.012 15.408 23.807C16.105 23.603 16.666 23.085 16.926 22.408C17.289 21.459 18.227 20.855 19.242 20.919C19.966 20.965 20.669 20.67 21.144 20.121C21.619 19.573 21.811 18.835 21.663 18.125C21.456 17.13 21.919 16.115 22.808 15.62C23.441 15.266 23.873 14.638 23.977 13.92C24.081 13.202 23.842 12.477 23.334 11.96ZM10.75 17.39L6.25 13.026L8.107 11.169L10.75 13.675L16.393 7.891L18.25 9.748L10.75 17.39Z"/>
 </svg>
diff --git a/bitvid_logo/home-icon.svg b/bitvid_logo/home-icon.svg
index 3774ff0d..16fa53c9 100644
--- a/bitvid_logo/home-icon.svg
+++ b/bitvid_logo/home-icon.svg
@@ -1,5 +1,3 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <path d="M12,6.453L21,14.828L21,24L15,24L15,18L9,18L9,24L3,24L3,14.828L12,6.453ZM24,12.148L12,1L0,12.133L1.361,13.598L12,3.73L22.639,13.613L24,12.148Z" fill="#5C6F8A" fill-rule="nonzero"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" fill-rule="nonzero">
+  <path d="M12 6.453 21 14.828V24h-6v-6H9v6H3v-9.172zM24 12.148 12 1 0 12.133l1.361 1.465L12 3.73l10.639 9.883z"/>
 </svg>
diff --git a/bitvid_logo/ipns-icon.svg b/bitvid_logo/ipns-icon.svg
index e7c339a6..9713cac9 100644
--- a/bitvid_logo/ipns-icon.svg
+++ b/bitvid_logo/ipns-icon.svg
@@ -1,5 +1,3 @@
-<?xml version="1.0" encoding="UTF-8" standalone="no"?>
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
-<svg width="100%" height="100%" viewBox="0 0 24 24" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" fill-rule="evenodd" clip-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2">
-    <path d="M21,7.702L12.5,12.322L12.5,22C14.067,21.135 18.879,18.483 20.477,17.601C20.8,17.424 21,17.082 21,16.71L21,7.702ZM11.5,12.321L3,7.599L3,16.605C3,16.975 3.197,17.313 3.514,17.492C5.104,18.39 9.93,21.115 11.5,22L11.5,12.321ZM3.421,6.692L12,11.455L20.672,6.742C20.672,6.742 14.041,3.004 12.486,2.128C12.335,2.043 12.167,2 12,2C11.832,2 11.665,2.043 11.514,2.128C9.959,3.004 3.421,6.692 3.421,6.692Z" fill="#5C6F8A" fill-rule="nonzero"/>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor" fill-rule="nonzero">
+  <path d="M21 7.702 12.5 12.322V22c1.567-.865 6.379-3.517 7.977-4.399.323-.177.523-.519.523-.891V7.702zm-9.5 4.619L3 7.599v9.006c0 .37.197.708.514.887 1.59.898 6.416 3.623 7.986 4.508v-9.789zm-8.079-5.629L12 11.455l8.672-4.713s-6.631-3.738-8.186-4.614c-.151-.085-.319-.128-.486-.128s-.335.043-.486.128c-1.555.876-8.093 4.564-8.093 4.564Z"/>
 </svg>
diff --git a/components/disclaimer.html b/components/disclaimer.html
index 8b13506f..79f6a444 100644
--- a/components/disclaimer.html
+++ b/components/disclaimer.html
@@ -16,11 +16,40 @@
     <div class="modal-body flex-1 overflow-y-auto">
       <div class="mx-auto max-w-3xl space-y-8 text-base text-text">
         <div class="flex justify-center pt-1">
-          <img
-            src="assets/svg/bitvid-logo-dark-mode.svg"
-            alt="bitvid logo"
-            class="h-12 w-auto"
-          />
+          <span
+            class="inline-flex h-12 items-center text-text"
+            style="--logo-wordmark-color: currentColor; --logo-accent-color: var(--color-logo-accent);"
+            role="img"
+            aria-label="bitvid logo"
+          >
+            <svg
+              class="h-full w-auto"
+              viewBox="0 0 318.32 108.98"
+              color="var(--logo-wordmark-color, var(--color-logo-wordmark-inverse))"
+              aria-hidden="true"
+              focusable="false"
+            >
+              <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+                <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+                <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+                <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+                <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+                <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+                <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+                <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+                <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+                <rect x="7.1" y="95.71" width="5.84" height="5.48" />
+              </g>
+              <g fill="currentColor">
+                <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+                <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+                <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+                <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+                <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+                <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
+              </g>
+            </svg>
+          </span>
         </div>
         <header class="space-y-4 text-center">
           <h2
diff --git a/css/tokens.css b/css/tokens.css
index 9c9ed280..a4cc2924 100644
--- a/css/tokens.css
+++ b/css/tokens.css
@@ -14,6 +14,11 @@
   --color-border-subtle: rgb(209 213 219);
   --color-primary: rgb(254 0 50);
   --color-secondary: rgb(255 147 165);
+  --color-logo-accent: var(--color-primary);
+  --color-logo-wordmark: var(--color-neutral-700);
+  --color-logo-wordmark-inverse: var(--color-white);
+  --color-logo-background: var(--color-neutral-700);
+  --color-logo-background-inverse: var(--color-white);
   --color-info: rgb(96 165 250);
   --color-info-strong: rgb(37 99 235);
   --color-info-pressed: rgb(29 78 216);
diff --git a/index.html b/index.html
index b2f8a602..6bd300e4 100644
--- a/index.html
+++ b/index.html
@@ -117,11 +117,40 @@
           aria-label="Return to the bitvid home page"
           class="fade-in fade-in-delay-100"
         >
-          <img
-            src="assets/svg/bitvid-logo-light-mode.svg"
-            alt="bitvid logo"
-            class="h-16"
-          />
+          <span
+            class="inline-flex h-16 items-center text-text-strong"
+            style="--logo-wordmark-color: currentColor; --logo-accent-color: var(--color-logo-accent);"
+            role="img"
+            aria-label="bitvid logo"
+          >
+            <svg
+              class="h-full w-auto"
+              viewBox="0 0 318.32 108.98"
+              color="var(--logo-wordmark-color, var(--color-logo-wordmark))"
+              aria-hidden="true"
+              focusable="false"
+            >
+              <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+                <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+                <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+                <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+                <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+                <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+                <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+                <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+                <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+                <rect x="7.1" y="95.71" width="5.84" height="5.48" />
+              </g>
+              <g fill="currentColor">
+                <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+                <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+                <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+                <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+                <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+                <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
+              </g>
+            </svg>
+          </span>
         </a>
 
         <!-- Buttons on the far right -->
diff --git a/torrent/beacon.html b/torrent/beacon.html
index 52fa6cc9..75350b10 100644
--- a/torrent/beacon.html
+++ b/torrent/beacon.html
@@ -43,11 +43,40 @@
           href="../index.html"
           aria-label="Return to the bitvid home page"
         >
-          <img
-            src="../assets/svg/bitvid-logo-light-mode.svg"
-            alt="bitvid logo"
-            class="header-torrent__logo-image"
-          />
+          <span
+            class="header-torrent__logo-image inline-flex items-center"
+            style="--logo-wordmark-color: currentColor; --logo-accent-color: var(--color-logo-accent);"
+            role="img"
+            aria-label="bitvid logo"
+          >
+            <svg
+              class="h-full w-auto"
+              viewBox="0 0 318.32 108.98"
+              color="var(--logo-wordmark-color, var(--color-logo-wordmark))"
+              aria-hidden="true"
+              focusable="false"
+            >
+              <g fill="var(--logo-accent-color, var(--color-logo-accent))">
+                <rect x="7.1" y="7.8" width="5.84" height="5.48" />
+                <rect x="7.1" y="18.78" width="24.02" height="5.48" />
+                <rect x="7.1" y="29.77" width="42.85" height="5.48" />
+                <rect x="7.1" y="40.76" width="61.68" height="5.48" />
+                <rect x="7.1" y="51.75" width="80.88" height="5.48" />
+                <rect x="7.1" y="62.74" width="61.68" height="5.48" />
+                <rect x="7.1" y="73.73" width="42.85" height="5.48" />
+                <rect x="7.1" y="84.72" width="24.02" height="5.48" />
+                <rect x="7.1" y="95.71" width="5.84" height="5.48" />
+              </g>
+              <g fill="currentColor">
+                <path d="M121.28 25.08v44.54c0 5.67 2.79 8.54 8.22 8.54h11.57c5.51 0 8.3-2.87 8.3-8.54v-13.09c0-5.67-2.79-8.46-8.3-8.46h-16.6v-5.83h17.72c8.7 0 13.01 4.47 13.01 13.33v15.01c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33V25.08h5.83Z" />
+                <path d="M168.53 25.08v6.26h-5.83v-6.26h5.83Zm0 17.56v41.27h-5.83v-41.27h5.83Z" />
+                <path d="M191.36 25.08v17.16h9.02v5.19h-9.02v36.48h-5.83v-36.48h-9.82v-5.19h9.82V25.08h5.83Z" />
+                <path d="M212.88 42.24l16.84 35.68 16.6-35.68h6.07l-19.56 41.67h-6.31l-20.04-41.67h6.39Z" />
+                <path d="M264.05 25.08v6.26h-5.83v-6.26h5.83Zm0 17.16v41.67h-5.83v-41.67h5.83Z" />
+                <path d="M311.21 25.08v45.5c0 8.86-4.31 13.33-13.01 13.33h-13.73c-8.7 0-13.01-4.47-13.01-13.33v-15.01c0-8.86 4.31-13.33 13.01-13.33h17.72v5.83h-16.6c-5.51 0-8.3 2.79-8.3 8.46v13.09c0 5.67 2.79 8.54 8.3 8.54h11.49c5.51 0 8.3-2.87 8.3-8.54V25.08h5.83Z" />
+              </g>
+            </svg>
+          </span>
         </a>
       </div>
     </header>