diff --git a/webui/src/web-components/sketch-timeline-message.ts b/webui/src/web-components/sketch-timeline-message.ts
index a2dd533..95de17a 100644
--- a/webui/src/web-components/sketch-timeline-message.ts
+++ b/webui/src/web-components/sketch-timeline-message.ts
@@ -596,13 +596,14 @@
               ? html` <span class="message-usage">
                   <span title="Input tokens"
                     >In:
-                    ${(this.message?.usage?.input_tokens || 0) +
-                    (this.message?.usage?.cache_read_input_tokens || 0) +
-                    (this.message?.usage?.cache_creation_input_tokens ||
-                      0)}</span
+                    ${this.formatNumber(
+                      (this.message?.usage?.input_tokens || 0) +
+                      (this.message?.usage?.cache_read_input_tokens || 0) +
+                      (this.message?.usage?.cache_creation_input_tokens || 0)
+                    )}</span
                   >
                   <span title="Output tokens"
-                    >Out: ${this.message?.usage?.output_tokens}</span
+                    >Out: ${this.formatNumber(this.message?.usage?.output_tokens)}</span
                   >
                   <span title="Message cost"
                     >(${this.formatCurrency(