diff --git a/ui-tui/src/components/messageLine.tsx b/ui-tui/src/components/messageLine.tsx
index b32f03cd78..a05c9fc0ab 100644
--- a/ui-tui/src/components/messageLine.tsx
+++ b/ui-tui/src/components/messageLine.tsx
@@ -1,4 +1,4 @@
-import { Box, Text } from '@hermes/ink'
+import { Ansi, Box, Text } from '@hermes/ink'
 import { memo } from 'react'
 
 import { LONG_MSG, ROLE } from '../constants.js'
@@ -40,7 +40,7 @@ export const MessageLine = memo(function MessageLine({
     }
 
     if (msg.role !== 'user' && hasAnsi(msg.text)) {
-      return <Text wrap="wrap">{msg.text}</Text>
+      return <Ansi>{msg.text}</Ansi>
     }
 
     if (msg.role === 'assistant') {
diff --git a/ui-tui/src/types/hermes-ink.d.ts b/ui-tui/src/types/hermes-ink.d.ts
index 7c8a8a7246..81faab32ea 100644
--- a/ui-tui/src/types/hermes-ink.d.ts
+++ b/ui-tui/src/types/hermes-ink.d.ts
@@ -45,6 +45,7 @@ declare module '@hermes/ink' {
   }
 
   export const Box: React.ComponentType<any>
+  export const Ansi: React.ComponentType<any>
   export const Text: React.ComponentType<any>
   export const TextInput: React.ComponentType<any>
   export const stringWidth: (s: string) => number