Skip to content

fix: user message text invisible in multimodal content #1103

@ulivz

Description

@ulivz

Problem

User messages with both text and images show invisible text due to color contrast issues.

Root Cause

  1. User messages use dark background (#141414) with white text
  2. Text-only: renders as raw text, inherits white color ✅
  3. Text+image: uses MarkdownRenderer without forceDarkTheme, renders gray text on dark background ❌

Technical Details

MultimodalContent.tsx calls MarkdownRenderer without theme:

<MarkdownRenderer content={part.text} /> // Missing forceDarkTheme

MarkdownRenderer defaults to light theme:

const themeClass = forceDarkTheme ? 'dark' : 'light';
// Results in text-gray-800 (dark gray) on #141414 background

Solution

Pass forceDarkTheme={true} to MarkdownRenderer in MultimodalContent.tsx:

<MarkdownRenderer content={part.text} forceDarkTheme={true} />

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions