diff --git a/packages/website/components/ThemeButton/index.tsx b/packages/website/components/ThemeButton/index.tsx
index 915f547a4..8b2dc0420 100644
--- a/packages/website/components/ThemeButton/index.tsx
+++ b/packages/website/components/ThemeButton/index.tsx
@@ -11,7 +11,19 @@ export default function (props: { defaultTheme: "auto" | "dark" | "light" }) {
 
   if (!showChild) {
     // You can show some kind of placeholder UI here
-    return null;
+    return <div className="flex items-center mr-4 ml-4 sm:ml-2 lg:ml-6">
+      <div className="dark:text-dark fill-gray-600">
+        <svg
+          xmlns="http://www.w3.org/2000/svg"
+          width={20}
+          height={20}
+          viewBox="0 0 1024 1024"
+          aria-label="auto icon"
+        >
+          <path d="M512 992C246.92 992 32 777.08 32 512S246.92 32 512 32s480 214.92 480 480-214.92 480-480 480zm0-840c-198.78 0-360 161.22-360 360 0 198.84 161.22 360 360 360s360-161.16 360-360c0-198.78-161.22-360-360-360zm0 660V212c165.72 0 300 134.34 300 300 0 165.72-134.28 300-300 300z"></path>
+        </svg>
+      </div>
+    </div>
   }
 
   return <Core {...props} />;