diff --git a/src/layouts/index.tsx b/src/layouts/index.tsx
index 09181be5..98c018f9 100644
--- a/src/layouts/index.tsx
+++ b/src/layouts/index.tsx
@@ -45,11 +45,11 @@ export default function (props: any) {
   }, [props.location.pathname]);
 
   useEffect(() => {
-    const theme = localStorage.getItem('qinglong_dark_theme') || 'auto';
+    const _theme = localStorage.getItem('qinglong_dark_theme') || 'auto';
     setFetchMethod(window.fetch);
-    if (theme === 'dark') {
+    if (_theme === 'dark') {
       enableDarkMode({});
-    } else if (theme === 'light') {
+    } else if (_theme === 'light') {
       disableDarkMode();
     } else {
       followSystemColorScheme({});
diff --git a/src/pages/login/index.tsx b/src/pages/login/index.tsx
index e72dda1a..b85c879c 100644
--- a/src/pages/login/index.tsx
+++ b/src/pages/login/index.tsx
@@ -12,6 +12,7 @@ import config from '@/utils/config';
 import { history, Link } from 'umi';
 import styles from './index.less';
 import { request } from '@/utils/http';
+import { useTheme } from '@/utils/hooks';
 
 const FormItem = Form.Item;
 const { Countdown } = Statistic;
@@ -19,6 +20,7 @@ const { Countdown } = Statistic;
 const Login = () => {
   const [loading, setLoading] = useState(false);
   const [waitTime, setWaitTime] = useState<any>();
+  const { theme } = useTheme();
 
   const handleOk = (values: any) => {
     setLoading(true);
@@ -106,7 +108,12 @@ const Login = () => {
                 <Button type="primary" style={{ width: '100%' }} disabled>
                   请
                   <Countdown
-                    valueStyle={{ color: 'rgba(232, 230, 227, 0.25)' }}
+                    valueStyle={{
+                      color:
+                        theme === 'vs'
+                          ? 'rgba(0,0,0,.25)'
+                          : 'rgba(232, 230, 227, 0.25)',
+                    }}
                     className="inline-countdown"
                     onFinish={() => setWaitTime(null)}
                     format="ss"