claude-code - 💡(How to fix) Fix [Feature Request] RTL (Right-to-Left) Language Support for Arabic, Hebrew, Persian, and Urdu [1 comments, 2 participants]

Problem Statement

Claude Code needs better support for Right-to-Left (RTL) languages, particularly Arabic. Currently, the chat interface and text handling are optimized for LTR (Left-to-Right) languages.

Problem

Users working with Arabic language face several issues:

• Chat interface does not properly reflect RTL text direction
• Text appears in incorrect orientation
• Poor visual alignment for Arabic characters and words
• User experience is compromised when switching between Arabic and English

Expected Behavior

• Full RTL support in chat interface when Arabic is used
• Proper text directionality detection based on language
• Correct character rendering and spacing for Arabic
• Seamless switching between LTR and RTL languages
• Interface elements should adapt to text direction

Current Behavior

• Chat interface remains LTR regardless of language input
• Arabic text may display incorrectly
• No automatic RTL detection or adaptation

Proposed Solution

1. Frontend Implementation

• Add dir="rtl" attribute to chat container when Arabic is detected
• Implement CSS logical properties (margin-inline, padding-inline) instead of left/right
• Use CSS flexbox/grid with proper alignment for RTL
• Add language detection using Accept-Language header or user settings

2. Text Direction Detection

Auto-detect language and apply appropriate direction:

• Arabic, Hebrew, Persian, Urdu → RTL
• English, French, Spanish, etc. → LTR
• Allow manual override in user settings

3. CSS Updates

Replace hardcoded left/right with logical CSS properties:

/* Before */
margin-left: 10px;  /* LTR only */

/* After */
margin-inline-start: 10px;  /* Works for both RTL and LTR */

• Ensure icons and UI elements flip correctly in RTL mode
• Test responsive design for RTL layouts

4. Typography & Font Support

• Add support for Arabic fonts (e.g., Segoe UI, Arabic Typesetting)
• Ensure proper character spacing and ligatures
• Support for diacritical marks (tashkeel) in Arabic

5. Message Alignment

• User messages: Right-aligned in RTL, left-aligned in LTR
• Assistant messages: Left-aligned in RTL, right-aligned in LTR
• Preserve code block formatting regardless of direction

6. Input Area

• RTL text input field with correct cursor behavior
• Support for mixed LTR/RTL text (bidirectional text handling)
• Proper placeholder text direction

7. Accessibility

• Ensure WCAG compliance for RTL layouts
• Proper lang attribute in HTML
• Screen reader compatibility for RTL content
• Keyboard navigation support

8. Browser Compatibility

• Test on: Chrome, Firefox, Safari, Edge
• Ensure consistent rendering across browsers
• Mobile browser support (iOS Safari, Chrome Mobile)

Use Cases

• Arabic-speaking developers using Claude Code
• Teams working on Arabic projects or documentation
• Multi-language projects requiring seamless code assistance

RTL Support Required For

• Arabic
• Hebrew
• Persian/Farsi
• Urdu

Priority

Critical — blocking productive use for RTL language users