Claude Web RTL

Right-to-left paragraph direction for claude.ai

Hebrew, Arabic, Persian, and other RTL scripts render the way they should — punctuation on the correct side, paragraphs aligned naturally, mixed-language conversations flowing per-paragraph.

---

Why

Claude's web UI renders all text LTR by default. For Hebrew or Arabic users this means:

• Punctuation lands on the wrong side
• Paragraphs left-align when they should right-align
• Mixed conversations look broken

This extension flips paragraph direction automatically per paragraph, based on the first strong directional character. English stays English. Hebrew goes RTL. Code blocks stay LTR. No manual switching.

How it works

Pure CSS, one rule:

unicode-bidi: plaintext;

Browser inspects each paragraph's first strong character and picks direction. No DOM observers, no perf cost, survives Claude's React rerenders.

Features

• Auto per-paragraph direction — Hebrew/Arabic paragraphs flip RTL, English stays LTR
• Code blocks protected — <pre>, <code>, <kbd>, <samp> forced LTR
• Toolbar toggle — one click on/off, instant, no reload
• Live icon state — full color when on, dimmed grayscale when off
• Persistent — choice synced across devices via chrome.storage.sync
• Zero dependencies — vanilla JS, no build step

Install

Option A — Release zip (recommended for users)

1. Download the latest claude-web-rtl-vX.Y.Z.zip from Releases
2. Unzip anywhere on disk
3. Open chrome://extensions
4. Enable Developer mode (top right)
5. Click Load unpacked → select the unzipped folder
6. Visit claude.ai

Option B — From source

git clone https://github.com/erango/claude-web-rtl.git

Then chrome://extensions → Developer mode → Load unpacked → select repo folder.

Note on .crx files

Stable Chrome blocks installing .crx files outside the Chrome Web Store — drag-and-drop installs are silently disabled on restart. Use the unpacked install above, or wait for the Web Store listing.

Power users can launch Chrome with --load-extension=/path/to/claude-web-rtl to load it persistently per profile.

Build a release

./scripts/release.sh

Outputs dist/claude-web-rtl-v<version>.zip ready for GitHub Releases or Chrome Web Store upload. Version is read from manifest.json.

Usage

Click the toolbar icon to toggle.

State	Icon	Behavior
On (default)	Full color	RTL active on claude.ai
Off	Grayscale, dimmed	Claude renders in default LTR

File layout

claude-web-rtl/
├── manifest.json      Manifest V3 declaration
├── content.js         Reads storage, toggles html.cwrtl-on class
├── content.css        unicode-bidi: plaintext rules, gated on class
├── background.js      Service worker, syncs toolbar icon to state
├── popup.html         Toolbar popup UI
├── popup.js           Popup checkbox ↔ storage binding
├── scripts/
│   └── release.sh     Builds dist/claude-web-rtl-v<version>.zip
└── icons/
    ├── icon16.png         icon48.png         icon128.png      (on)
    └── icon16-off.png     icon48-off.png     icon128-off.png  (off)

Permissions

Permission	Why
storage	Persist on/off toggle across sessions and devices
https://claude.ai/* (host)	Inject CSS only on Claude — nowhere else

No analytics. No network calls. No tracking. Source is ~100 lines you can read in a minute.

Development

No build step. Edit a file, hit Reload on chrome://extensions, refresh the Claude tab.

To customize selectors or add sites, edit content.css and manifest.json's matches.

License

MIT