diff --git a/packages/docs/static/logo-dark.png b/packages/docs/static/logo-dark.png
new file mode 100644
index 000000000..8f780d147
Binary files /dev/null and b/packages/docs/static/logo-dark.png differ
diff --git a/packages/docs/static/logo.svg b/packages/docs/static/logo.svg
index a85c5509c..a1166eb77 100644
--- a/packages/docs/static/logo.svg
+++ b/packages/docs/static/logo.svg
@@ -1,4 +1,4 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="256" height="256" style="font-family:Inter, sans-serif;font-size:12px;letter-spacing:0.1em;fill:currentcolor;color:inherit;pointer-events:none"><defs><style type="text/css">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="256" height="256" style="font-family:Inter, sans-serif;font-size:12px;letter-spacing:0.1em;fill:currentcolor;color:currentcolor;pointer-events:none"><defs><style type="text/css">
 <![CDATA[
 @font-face {
   font-family: 'Inter';
@@ -9,4 +9,4 @@
   unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
 }
 ]]>
-</style><mask id="ui"><rect width="32" height="32" fill="white"></rect><text x="16" y="21" fill="black" text-anchor="middle">UI</text></mask></defs><circle cx="16" cy="16" r="16" mask="url(#ui)"></circle></svg>
\ No newline at end of file
+</style><mask id="ui"><rect width="32" height="32" fill="white"></rect><text x="16" y="21" fill="black" text-anchor="middle">UI</text></mask></defs><circle cx="16" cy="16" r="16" mask="url(#ui)"></circle></svg>
diff --git a/packages/theme-ui/README.md b/packages/theme-ui/README.md
index 2a7bcdc14..e8d177e22 100644
--- a/packages/theme-ui/README.md
+++ b/packages/theme-ui/README.md
@@ -1,8 +1,15 @@
 <p align="center">
   <img
-    src="/packages/docs/static/logo.png"
+    src="/packages/docs/static/logo-dark.png#gh-dark-mode-only"
     width="96"
     height="96"
+    alt="Theme UI logo"
+  />
+  <img
+    src="/packages/docs/static/logo.png#gh-light-mode-only"
+    width="96"
+    height="96"
+    alt="Theme UI logo"
   />
 </p>