diff --git a/packages/opencode/src/cli/cmd/tui/feature-plugins/sidebar/context.tsx b/packages/opencode/src/cli/cmd/tui/feature-plugins/sidebar/context.tsx
index 561d67a65..3e781c7b8 100644
--- a/packages/opencode/src/cli/cmd/tui/feature-plugins/sidebar/context.tsx
+++ b/packages/opencode/src/cli/cmd/tui/feature-plugins/sidebar/context.tsx
@@ -2,6 +2,7 @@ import type { AssistantMessage } from "@mimo-ai/sdk/v2"
 import type { TuiPlugin, TuiPluginApi, TuiPluginModule } from "@mimo-ai/plugin/tui"
 import { Show, createEffect, createMemo, createSignal, onCleanup } from "solid-js"
 import { completedTPS, formatTPS, streamingTPS } from "./tps"
+import { Locale } from "@/util"
 
 const id = "internal:sidebar-context"
 const REFRESH_MS = 1000
@@ -69,6 +70,9 @@ function View(props: { api: TuiPluginApi; session_id: string }) {
     if (!last) {
       return {
         tokens: 0,
+        input: 0,
+        cache: 0,
+        cachePercent: null,
         percent: null,
       }
     }
@@ -76,8 +80,12 @@ function View(props: { api: TuiPluginApi; session_id: string }) {
     const tokens =
       last.tokens.input + last.tokens.output + last.tokens.reasoning + last.tokens.cache.read + last.tokens.cache.write
     const model = props.api.state.provider.find((item) => item.id === last.providerID)?.models[last.modelID]
+    const totalInput = last.tokens.input + last.tokens.cache.read + last.tokens.cache.write
     return {
       tokens,
+      input: last.tokens.input,
+      cache: last.tokens.cache.read + last.tokens.cache.write,
+      cachePercent: totalInput > 0 ? Math.round((last.tokens.cache.read + last.tokens.cache.write) / totalInput * 100) : 0,
       percent: model?.limit.context ? Math.round((tokens / model.limit.context) * 100) : null,
     }
   })
@@ -87,8 +95,11 @@ function View(props: { api: TuiPluginApi; session_id: string }) {
       <text fg={theme().text}>
         <b>Context</b>
       </text>
-      <text fg={theme().textMuted}>{state().tokens.toLocaleString()} tokens</text>
-      <text fg={theme().textMuted}>{state().percent ?? 0}% used</text>
+      <text fg={theme().textMuted}>{state().tokens.toLocaleString()} tokens ({state().percent ?? 0}%)</text>
+      <Show when={state().input > 0 || state().cache > 0}>
+        <text fg={theme().textMuted}>Input {Locale.number(state().input)} · Cache {Locale.number(state().cache)}</text>
+        <text fg={theme().textMuted}>{state().cachePercent}% cached</text>
+      </Show>
       <Show when={tpsLabel()}>{(label) => <text fg={theme().textMuted}>{label()}</text>}</Show>
       <text fg={theme().textMuted}>{money.format(cost())} spent</text>
     </box>