diff --git a/src/components/Footer.astro b/src/components/Footer.astro
index 74dbaf88a..04ab1dea9 100644
--- a/src/components/Footer.astro
+++ b/src/components/Footer.astro
@@ -16,7 +16,10 @@ try {
     const year = date.getFullYear();
     const month = (date.getMonth() + 1).toString().padStart(2, '0');
     const day = date.getDate().toString().padStart(2, '0');
-    buildDate = `${year}-${month}-${day}`;
+    const hours = date.getHours().toString().padStart(2, '0');
+    const minutes = date.getMinutes().toString().padStart(2, '0');
+    const seconds = date.getSeconds().toString().padStart(2, '0');
+    buildDate = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
 } catch (e) {
     console.warn("Failed to get git info", e);
 }
@@ -45,7 +48,19 @@ try {
 
 		<a class="transition link text-[var(--primary)] font-medium inline-flex items-center" href="https://beian.miit.gov.cn/#/Integrated/index" target="_blank"><img alt="" src="/favicon/foot-icp.png" class="h-4 mr-1">皖ICP备2025099787号-2</a>
         <br>
+        <span id="server-info" class="text-black/30 dark:text-white/30 text-xs"></span>
          <!-- <a class="transition link text-[var(--primary)] font-medium inline-flex items-center" href="https://beian.mps.gov.cn/#/query/webSearch?code=34010302002608" target="_blank"><img alt="" src="/favicon/foot-ga.png" class="h-4 mr-1">皖公网安备34010302002608号</a>
         <br> -->
     </div>
 </div>
+
+<script>
+    fetch(window.location.href, { method: "HEAD" }).then(response => {
+        const server = response.headers.get('server');
+        const serverInfo = document.getElementById('server-info');
+        if (serverInfo) {
+            if (server) {
+                serverInfo.innerText = `访问节点: ${server}`;
+        }
+    });
+</script>
diff --git a/src/components/widget/DisplaySettings.svelte b/src/components/widget/DisplaySettings.svelte
index 8ec4792ac..e487b982d 100644
--- a/src/components/widget/DisplaySettings.svelte
+++ b/src/components/widget/DisplaySettings.svelte
@@ -13,6 +13,9 @@ import {
 	setRainbowSpeed,
 	getBgBlur,
 	setBgBlur,
+    setBgHueRotate,
+    getHideBg,
+    setHideBg,
 } from "@utils/setting-utils";
 import { AUTO_MODE, DARK_MODE, LIGHT_MODE } from "@constants/constants";
 
@@ -21,7 +24,10 @@ let theme = getStoredTheme();
 let isRainbowMode = getRainbowMode();
 let rainbowSpeed = getRainbowSpeed();
 let bgBlur = getBgBlur();
+let hideBg = getHideBg();
 let animationId: number;
+let lastUpdate = 0;
+let rainbowHue = 0; // Independent hue for background rotation
 
 const defaultHue = getDefaultHue();
 
@@ -56,13 +62,21 @@ function toggleRainbow() {
 	setRainbowMode(isRainbowMode);
 
 	if (isRainbowMode) {
-		updateRainbow();
+		lastUpdate = performance.now();
+        rainbowHue = 0; // Reset rotation start
+		animationId = requestAnimationFrame(updateRainbow);
 	} else {
 		cancelAnimationFrame(animationId);
-		setHue(hue, true);
+        // Reset background rotation to 0 when stopped
+        setBgHueRotate(0);
 	}
 }
 
+function toggleHideBg() {
+	hideBg = !hideBg;
+	setHideBg(hideBg);
+}
+
 function onSpeedChange() {
 	setRainbowSpeed(rainbowSpeed);
 }
@@ -134,6 +148,16 @@ onMount(() => {
                class="slider" id="colorSlider" step="1" style="width: 100%">
     </div>
 
+    <div class="flex flex-row gap-2 mb-3 items-center justify-between">
+        <div class="flex gap-2 font-bold text-lg text-neutral-900 dark:text-neutral-100 transition relative ml-3
+            before:w-1 before:h-4 before:rounded-md before:bg-[var(--primary)]
+            before:absolute before:-left-3 before:top-[0.33rem]"
+        >
+            禁用背景
+        </div>
+        <input type="checkbox" class="toggle-switch" checked={hideBg} on:change={toggleHideBg} />
+    </div>
+
     <div class="flex flex-row gap-2 mb-3 items-center justify-between">
         <div class="flex gap-2 font-bold text-lg text-neutral-900 dark:text-neutral-100 transition relative ml-3
             before:w-1 before:h-4 before:rounded-md before:bg-[var(--primary)]
diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro
index d573325c6..04d64bf1c 100644
--- a/src/layouts/Layout.astro
+++ b/src/layouts/Layout.astro
@@ -403,7 +403,7 @@ import {
 	// SizeObserverPlugin,
 	// ClickScrollPlugin
 } from 'overlayscrollbars';
-import {getHue, getStoredTheme, setHue, setTheme, getBgBlur, setBgBlur} from "../utils/setting-utils";
+import {getHue, getStoredTheme, setHue, setTheme, getBgBlur, setBgBlur, getHideBg, setHideBg} from "../utils/setting-utils";
 import {pathsEqual, url} from "../utils/url-utils";
 import {
 	BANNER_HEIGHT,
@@ -489,6 +489,7 @@ function loadHue() {
 
 function loadBgBlur() {
 	setBgBlur(getBgBlur())
+    setHideBg(getHideBg())
 }
 
 function initCustomScrollbar() {
diff --git a/src/utils/setting-utils.ts b/src/utils/setting-utils.ts
index a00b77c50..e6506412e 100644
--- a/src/utils/setting-utils.ts
+++ b/src/utils/setting-utils.ts
@@ -71,6 +71,29 @@ export function setBgHueRotate(hue: number): void {
     }
 }
 
+export function getBgHueRotate(): number {
+    const bgBox = document.getElementById("bg-box");
+    if (bgBox) {
+        const currentFilter = bgBox.style.filter || "";
+        const hueRotateMatch = currentFilter.match(/hue-rotate\((.*?)deg\)/);
+        return hueRotateMatch ? Number.parseInt(hueRotateMatch[1]) : 0;
+    }
+    return 0;
+}
+
+export function getHideBg(): boolean {
+	const stored = localStorage.getItem("hide-bg");
+	return stored === "true";
+}
+
+export function setHideBg(hide: boolean): void {
+	localStorage.setItem("hide-bg", String(hide));
+	const bgBox = document.getElementById("bg-box");
+	if (bgBox) {
+		bgBox.style.setProperty("display", hide ? "none" : "");
+	}
+}
+
 export function applyThemeToDocument(theme: LIGHT_DARK_MODE) {
 	switch (theme) {
 		case LIGHT_MODE: