Support RTL (Right-to-Left) text direction for Hebrew/Arabic in chat webview

Resolved 💬 2 comments Opened Mar 2, 2026 by Gold-b Closed Mar 31, 2026

Problem

The Claude Code VS Code extension chat webview forces LTR direction on all elements via:

*{direction:ltr;unicode-bidi:normal}

This breaks rendering for Hebrew and Arabic text — all RTL content appears left-aligned and reads incorrectly in the conversation panel and input area.

Expected Behavior

Hebrew/Arabic text in messages (both user and assistant) should flow right-to-left using the browser's native Unicode BIDI algorithm, while code blocks, file paths, and UI layout remain LTR.

Current Workaround

Manually patching webview/index.css after every extension update:

  1. Replace *{direction:ltr;unicode-bidi:normal}*{unicode-bidi:plaintext}
  2. Append RTL rules for message elements:
[class*="message_"],[class*="content_"]{unicode-bidi:plaintext}
[class*="messagesContainer_"]{direction:rtl}
[class*="messageInput_"] textarea{direction:rtl;text-align:right}
[class*="message_"] pre,[class*="message_"] code{direction:ltr!important;unicode-bidi:isolate}

This is fragile (class names are hashed) and lost on every update.

Proposed Solution

Add a setting like claudeCode.interfaceDirection with values "ltr" (default) / "rtl" / "auto", and/or:

  • Add dir="auto" attribute to message content containers
  • Use unicode-bidi: plaintext instead of normal on the global rule so the BIDI algorithm can detect text direction naturally
  • Keep code blocks, paths, and structural UI as direction: ltr

Impact

This affects all users who communicate in RTL languages (Hebrew, Arabic, Persian, Urdu). Claude Code's own system instructions support Hebrew communication (CLAUDE.md), but the UI doesn't render it correctly.

Environment

  • Claude Code extension v2.1.63
  • VS Code on Windows 11
  • Language: Hebrew

View original on GitHub ↗

This issue has 2 comments on GitHub. Read the full discussion on GitHub ↗