diff --git a/web/src/common.ts b/web/src/common.ts
index 1879791..e6c0b9d 100644
--- a/web/src/common.ts
+++ b/web/src/common.ts
@@ -29,7 +29,10 @@ export function channelName(channels: Channel[], id: string) {
   return channels.find(c => c.id === id)?.name || id
 }
 
-export const usageHeads = ['请求数', '输入 tokens', '输出 tokens', '缓存读取', '缓存写入']
+export const usageHeads = ['请求数', '输入 tokens', '输出 tokens', '缓存读取', '缓存写入', '缓存率']
+
+/** 缓存率＝缓存读取 ÷ 输入 tokens；输入已含缓存读写（protocol 归一化），输入为零或用量未知时显示 —。 */
+export const cacheRate = (u: Usage) => (u.input_tokens ? num(Math.round((u.cache_read_tokens / u.input_tokens) * 1000) / 10) + '%' : '—')
 
 export const usageCells = (u: Usage) =>
-  [u.requests, u.input_tokens, u.output_tokens, u.cache_read_tokens, u.cache_write_tokens].map(num)
+  [u.requests, u.input_tokens, u.output_tokens, u.cache_read_tokens, u.cache_write_tokens].map(num).concat(cacheRate(u))
diff --git a/web/src/pages/Overview.tsx b/web/src/pages/Overview.tsx
index 7d7b5f6..ddd73f5 100644
--- a/web/src/pages/Overview.tsx
+++ b/web/src/pages/Overview.tsx
@@ -34,7 +34,7 @@ export function Overview({ stats, channels }: { stats: Stats | null; channels: C
           )
         })}
       </div>
-      <p className="muted">用量未知不代表零消耗；tokens 以已返回用量为准。</p>
+      <p className="muted">用量未知不代表零消耗；tokens 以已返回用量为准；缓存率为缓存读取占输入 tokens 的比例。</p>
       <section className="panel">
         <h2>每日用量</h2>
         <UsageChart data={stats.daily ?? []} />