diff --git a/webui/src/web-components/sketch-tool-card-browser-eval.ts b/webui/src/web-components/sketch-tool-card-browser-eval.ts
index 4030b02..935b5e2 100644
--- a/webui/src/web-components/sketch-tool-card-browser-eval.ts
+++ b/webui/src/web-components/sketch-tool-card-browser-eval.ts
@@ -28,19 +28,21 @@
     const displayExpression =
       expression.length > 50 ? expression.substring(0, 50) + "..." : expression;
 
-    const summaryContent = html`<span class="font-mono text-gray-700 break-all">
+    const summaryContent = html`<span
+      class="font-mono text-gray-700 dark:text-gray-300 break-all"
+    >
       📱 ${displayExpression}
     </span>`;
     const inputContent = html`<div>
       Evaluate:
       <span
-        class="font-mono bg-black/[0.05] px-2 py-1 rounded inline-block break-all"
+        class="font-mono bg-black/[0.05] dark:bg-white/[0.1] dark:bg-white/[0.1] px-2 py-1 rounded inline-block break-all"
         >${expression}</span
       >
     </div>`;
     const resultContent = this.toolCall?.result_message?.tool_result
       ? html`<pre
-          class="bg-gray-200 text-black p-2 rounded whitespace-pre-wrap break-words max-w-full w-full box-border"
+          class="bg-gray-200 dark:bg-gray-700 text-black dark:text-gray-100 p-2 rounded whitespace-pre-wrap break-words max-w-full w-full box-border"
         >
 ${this.toolCall.result_message.tool_result}</pre
         >`