diff --git a/.github/logo-dark.svg b/.github/logo-dark.svg
new file mode 100644
index 00000000..9d7fd7a3
--- /dev/null
+++ b/.github/logo-dark.svg
@@ -0,0 +1,27 @@
+<svg height="458" viewBox="0 0 1064 458" width="1064" xmlns="http://www.w3.org/2000/svg">
+  <style>
+    :root {
+      --pico-logo-wordmark: #fff;
+      --pico-logo-small-sparkles: #ff9500;
+      --pico-logo-big-sparkle: #ffbf00;
+    }
+    .pico-logo-wordmark {
+      fill: var(--pico-logo-wordmark);
+    }
+    .pico-logo-small-sparkles {
+      fill: var(--pico-logo-small-sparkles);
+    }
+    .pico-logo-big-sparkle {
+      fill: var(--pico-logo-big-sparkle);
+    }
+  </style>
+  <path d="m993.708 161.083c-1.475.567-2.641 1.733-3.208 3.208l-21.822 56.738c-1.836 4.774-8.59 4.774-10.426 0l-21.823-56.738c-.567-1.475-1.733-2.641-3.208-3.208l-56.738-21.823c-4.774-1.836-4.774-8.59 0-10.426l56.738-21.822c1.475-.567 2.641-1.733 3.208-3.208l21.823-56.7383c1.836-4.7737 8.59-4.7737 10.426 0l21.822 56.7383c.567 1.475 1.733 2.641 3.208 3.208l56.742 21.822c4.77 1.836 4.77 8.59 0 10.426z" class="pico-logo-big-sparkle" />
+  <path d="m834.63 86.9817c-1.836 4.7738-8.59 4.7738-10.426 0l-7.859-20.4337c-.567-1.475-1.733-2.6407-3.208-3.208l-20.433-7.8592c-4.774-1.836-4.774-8.59 0-10.426l20.433-7.8591c1.475-.5674 2.641-1.733 3.208-3.2081l7.859-20.4337c1.836-4.77377 8.59-4.77375 10.426 0l7.86 20.4337c.567 1.4751 1.733 2.6407 3.208 3.2081l20.433 7.8591c4.774 1.836 4.774 8.59 0 10.426l-20.433 7.8592c-1.475.5673-2.641 1.733-3.208 3.208z" class="pico-logo-small-sparkles" />
+  <path d="m879.209 230.899c-1.475.568-2.64 1.733-3.208 3.208l-7.859 20.434c-1.836 4.774-8.59 4.774-10.426 0l-7.859-20.434c-.567-1.475-1.733-2.64-3.208-3.208l-20.434-7.859c-4.773-1.836-4.773-8.59 0-10.426l20.434-7.859c1.475-.567 2.641-1.733 3.208-3.208l7.859-20.434c1.836-4.774 8.59-4.774 10.426 0l7.859 20.434c.568 1.475 1.733 2.641 3.208 3.208l20.434 7.859c4.774 1.836 4.774 8.59 0 10.426z" class="pico-logo-small-sparkles" />
+  <g class="pico-logo-wordmark">
+    <path d="m0 457.995v-282.83h59.1396l3.6208 37.172v245.658zm119.889-75.96c-16.629 0-30.5761-4.175-41.8408-12.525-11.2647-8.62-19.7132-20.876-25.3455-36.768-5.6324-15.892-8.4485-34.748-8.4485-56.566 0-22.088 2.8161-40.943 8.4485-56.566 5.6323-15.893 14.0808-28.014 25.3455-36.364 11.2647-8.62 25.2118-12.93 41.8408-12.93 18.774 0 35.001 4.31 48.679 12.93 13.679 8.35 24.139 20.471 31.38 36.364 7.242 15.623 10.863 34.478 10.863 56.566 0 21.818-3.621 40.674-10.863 56.566-7.241 15.892-17.701 28.148-31.38 36.768-13.678 8.35-29.905 12.525-48.679 12.525zm-16.093-58.182c8.046 0 15.154-2.02 21.323-6.061 6.168-4.04 11.13-9.562 14.885-16.566 3.755-7.272 5.632-15.623 5.632-25.05 0-9.428-1.743-17.643-5.23-24.647-3.486-7.273-8.448-12.929-14.885-16.97-6.169-4.04-13.276-6.06-21.323-6.06-8.0458 0-15.2874 2.02-21.7244 6.06-6.1687 4.041-10.9964 9.697-14.4831 16.97s-5.2301 15.488-5.2301 24.647c0 9.427 1.7434 17.778 5.2301 25.05 3.4867 7.004 8.3144 12.526 14.4831 16.566 6.1688 4.041 13.2763 6.061 21.3224 6.061z" />
+    <path d="m245.196 377.187v-202.022h62.76v202.022zm31.38-227.881c-9.387 0-17.702-3.502-24.943-10.505-6.974-7.273-10.46-15.623-10.46-25.051 0-9.966 3.486-18.3165 10.46-25.0505 7.241-7.0035 15.556-10.5052 24.943-10.5052 9.655 0 17.97 3.5017 24.943 10.5052 6.973 6.734 10.46 15.0845 10.46 25.0505 0 9.428-3.487 17.778-10.46 25.051-6.973 7.003-15.288 10.505-24.943 10.505z" />
+    <path d="m452.936 382.035c-21.457 0-40.634-4.444-57.531-13.333-16.629-9.159-29.637-21.684-39.024-37.576-9.387-16.162-14.081-34.479-14.081-54.95 0-20.741 4.694-39.058 14.081-54.95 9.387-15.893 22.261-28.283 38.622-37.172 16.629-9.159 35.671-13.738 57.128-13.738 20.652 0 39.56 5.253 56.726 15.758 17.165 10.505 29.502 25.724 37.012 45.657l-59.542 20.202c-2.95-6.465-7.912-11.717-14.885-15.758-6.705-4.309-14.215-6.464-22.53-6.464-8.314 0-15.69 2.02-22.127 6.06-6.168 3.771-11.13 9.159-14.885 16.162-3.487 7.004-5.23 15.084-5.23 24.243 0 9.158 1.743 17.239 5.23 24.242 3.755 6.734 8.851 12.122 15.288 16.162 6.705 4.041 14.215 6.061 22.529 6.061 8.315 0 15.824-2.155 22.529-6.465 6.706-4.31 11.667-9.966 14.886-16.97l59.542 20.202c-7.778 20.203-20.25 35.691-37.415 46.465-16.897 10.775-35.672 16.162-56.323 16.162z" />
+    <path d="m672.537 382.035c-21.188 0-39.962-4.444-56.323-13.333-16.093-9.159-28.832-21.684-38.22-37.576-9.119-15.893-13.678-34.209-13.678-54.95s4.559-39.058 13.678-54.95c9.119-15.893 21.725-28.283 37.818-37.172 16.36-9.159 34.866-13.738 55.518-13.738 21.189 0 39.829 4.579 55.922 13.738 16.36 8.889 29.1 21.279 38.219 37.172 9.119 15.892 13.679 34.209 13.679 54.95s-4.56 39.057-13.679 54.95c-9.119 15.892-21.725 28.417-37.817 37.576-15.824 8.889-34.196 13.333-55.117 13.333zm-.402-59.798c8.314 0 15.422-1.886 21.322-5.657 6.169-4.04 10.997-9.428 14.484-16.162 3.486-7.003 5.23-15.084 5.23-24.242 0-9.159-1.878-17.105-5.633-23.839-3.486-7.003-8.314-12.39-14.483-16.162-6.169-4.04-13.276-6.06-21.322-6.06s-15.154 2.02-21.323 6.06c-6.168 3.772-10.996 9.159-14.483 16.162-3.487 6.734-5.23 14.68-5.23 23.839 0 8.889 1.743 16.835 5.23 23.838 3.487 7.004 8.315 12.526 14.483 16.566 6.437 3.771 13.679 5.657 21.725 5.657z" />
+  </g>
+</svg>
\ No newline at end of file
diff --git a/.github/logo.svg b/.github/logo-light.svg
similarity index 98%
rename from .github/logo.svg
rename to .github/logo-light.svg
index 9a52681f..e5d38f92 100644
--- a/.github/logo.svg
+++ b/.github/logo-light.svg
@@ -1,18 +1,19 @@
 <svg height="458" viewBox="0 0 1064 458" width="1064" xmlns="http://www.w3.org/2000/svg">
   <style>
     :root {
+      --pico-logo-wordmark: #2a3140;
       --pico-logo-small-sparkles: #ffbf00;
       --pico-logo-big-sparkle: #ff9500;
     }
+    .pico-logo-wordmark {
+      fill: var(--pico-logo-wordmark);
+    }
     .pico-logo-small-sparkles {
       fill: var(--pico-logo-small-sparkles);
     }
     .pico-logo-big-sparkle {
       fill: var(--pico-logo-big-sparkle);
     }
-    .pico-logo-wordmark {
-      fill: currentColor
-    }
   </style>
   <path d="m993.708 161.083c-1.475.567-2.641 1.733-3.208 3.208l-21.822 56.738c-1.836 4.774-8.59 4.774-10.426 0l-21.823-56.738c-.567-1.475-1.733-2.641-3.208-3.208l-56.738-21.823c-4.774-1.836-4.774-8.59 0-10.426l56.738-21.822c1.475-.567 2.641-1.733 3.208-3.208l21.823-56.7383c1.836-4.7737 8.59-4.7737 10.426 0l21.822 56.7383c.567 1.475 1.733 2.641 3.208 3.208l56.742 21.822c4.77 1.836 4.77 8.59 0 10.426z" class="pico-logo-big-sparkle" />
   <path d="m834.63 86.9817c-1.836 4.7738-8.59 4.7738-10.426 0l-7.859-20.4337c-.567-1.475-1.733-2.6407-3.208-3.208l-20.433-7.8592c-4.774-1.836-4.774-8.59 0-10.426l20.433-7.8591c1.475-.5674 2.641-1.733 3.208-3.2081l7.859-20.4337c1.836-4.77377 8.59-4.77375 10.426 0l7.86 20.4337c.567 1.4751 1.733 2.6407 3.208 3.2081l20.433 7.8591c4.774 1.836 4.774 8.59 0 10.426l-20.433 7.8592c-1.475.5673-2.641 1.733-3.208 3.208z" class="pico-logo-small-sparkles" />
diff --git a/README.md b/README.md
index 0cd88d16..771a6666 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,12 @@
-<a href="https://picocss.com/">
-  <img src=".github/logo.svg" width="auto" height="60">
-</a>
+<p>
+  <a href="https://picocss.com" target="_blank">
+    <picture>
+      <source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/picocss/pico/HEAD/.github/logo-dark.svg">
+      <source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/picocss/pico/HEAD/.github/logo-light.svg">
+      <img alt="Pico CSS" src="https://raw.githubusercontent.com/picocss/pico/HEAD/.github/logo-light.svg" width="auto" height="60">
+    </picture>
+  </a>
+</p>
 
 ## Minimal CSS Framework for Semantic HTML