diff --git a/src/components/StockChangeIndicators.js b/src/components/StockChangeIndicators.js
index daff42d9..58220228 100644
--- a/src/components/StockChangeIndicators.js
+++ b/src/components/StockChangeIndicators.js
@@ -47,29 +47,29 @@ const StockChangeIndicators = ({
         }
     };
 
-    // 根据涨跌幅获取背景色（跟随数字颜色）
+    // 根据涨跌幅获取背景色（永远比文字色浅）
     const getBgColor = (value) => {
         if (value == null) {
-            return useColorModeValue('gray.100', 'gray.700');
+            return useColorModeValue('gray.50', 'gray.800');
         }
 
         // 0值使用中性灰色背景
         if (value === 0) {
-            return useColorModeValue('gray.100', 'gray.700');
+            return useColorModeValue('gray.50', 'gray.800');
         }
 
         const absValue = Math.abs(value);
         const isPositive = value > 0;
 
         if (isPositive) {
-            // 上涨背景：红色系 → 橙色系
+            // 上涨背景：红色系 → 橙色系（统一使用 50 最浅色）
             if (absValue >= 10) return useColorModeValue('red.50', 'red.900');
             if (absValue >= 5) return useColorModeValue('red.50', 'red.900');
             if (absValue >= 3) return useColorModeValue('red.50', 'red.900');
             if (absValue >= 1) return useColorModeValue('orange.50', 'orange.900');
             return useColorModeValue('orange.50', 'orange.900');
         } else {
-            // 下跌背景：绿色系 → 青色系
+            // 下跌背景：绿色系 → 青色系（统一使用 50 最浅色）
             if (absValue >= 10) return useColorModeValue('green.50', 'green.900');
             if (absValue >= 5) return useColorModeValue('green.50', 'green.900');
             if (absValue >= 3) return useColorModeValue('green.50', 'green.900');
@@ -78,34 +78,34 @@ const StockChangeIndicators = ({
         }
     };
 
-    // 根据涨跌幅获取边框色（跟随数字颜色）
+    // 根据涨跌幅获取边框色（比背景深，比文字浅）
     const getBorderColor = (value) => {
         if (value == null) {
-            return useColorModeValue('gray.300', 'gray.600');
+            return useColorModeValue('gray.200', 'gray.700');
         }
 
         // 0值使用中性灰色边框
         if (value === 0) {
-            return useColorModeValue('gray.300', 'gray.600');
+            return useColorModeValue('gray.200', 'gray.700');
         }
 
         const absValue = Math.abs(value);
         const isPositive = value > 0;
 
         if (isPositive) {
-            // 上涨边框：红色系 → 橙色系
-            if (absValue >= 10) return useColorModeValue('red.200', 'red.700');
-            if (absValue >= 5) return useColorModeValue('red.200', 'red.700');
-            if (absValue >= 3) return useColorModeValue('red.200', 'red.700');
-            if (absValue >= 1) return useColorModeValue('orange.200', 'orange.700');
-            return useColorModeValue('orange.200', 'orange.700');
+            // 上涨边框：红色系 → 橙色系（跟随文字深浅）
+            if (absValue >= 10) return useColorModeValue('red.200', 'red.800');      // 文字 red.900
+            if (absValue >= 5) return useColorModeValue('red.200', 'red.700');       // 文字 red.700
+            if (absValue >= 3) return useColorModeValue('red.100', 'red.600');       // 文字 red.500
+            if (absValue >= 1) return useColorModeValue('orange.200', 'orange.700'); // 文字 orange.600
+            return useColorModeValue('orange.100', 'orange.600');                    // 文字 orange.400
         } else {
-            // 下跌边框：绿色系 → 青色系
-            if (absValue >= 10) return useColorModeValue('green.200', 'green.700');
-            if (absValue >= 5) return useColorModeValue('green.200', 'green.700');
-            if (absValue >= 3) return useColorModeValue('green.200', 'green.700');
-            if (absValue >= 1) return useColorModeValue('teal.200', 'teal.700');
-            return useColorModeValue('teal.200', 'teal.700');
+            // 下跌边框：绿色系 → 青色系（跟随文字深浅）
+            if (absValue >= 10) return useColorModeValue('green.200', 'green.800');  // 文字 green.900
+            if (absValue >= 5) return useColorModeValue('green.200', 'green.700');   // 文字 green.700
+            if (absValue >= 3) return useColorModeValue('green.100', 'green.600');   // 文字 green.500
+            if (absValue >= 1) return useColorModeValue('teal.200', 'teal.700');     // 文字 teal.600
+            return useColorModeValue('teal.100', 'teal.600');                        // 文字 teal.400
         }
     };