Skip to content

Input box & user-message background fills render as inconsistent off-colour blocks across terminals/themes #5771

Description

@chiga0

Describe the bug

The TUI paints no background of its own — almost everything relies on the terminal's own background. Two elements break that rule and flood-fill a theme colour:

  1. The input box (the bottom > prompt area) fills theme.background.primary.
  2. The band behind each user message fills a subtleBandColor variant of the same token.

On most terminal/theme combinations these fills render as a visibly off-colour block that does not match the terminal's real background, so they look like stray coloured rectangles. Worse, the user-message band is inconsistent: on the same screen some user messages have it and some don't.

Repro

  • Use a dark terminal (e.g. iTerm2 default).
  • Send a few messages under Qwen Light, then switch to Qwen Dark and send a few more.
  • The Qwen Dark user messages show a grey band block; the Qwen Light ones don't. The input box shows an off-colour block whose colour doesn't match the terminal.

Root cause

That mitigation is not enough, for three reasons:

  1. It compares only the light/dark bucket, not the actual colour. Even when both are "dark", the theme background (e.g. Qwen Dark #0b0e14) differs from the terminal's real background, so the input fill still shows as a distinct block.
  2. Terminal brightness detection is unreliable. Over SSH/remote, COLORFGBG is usually unset, the macOS defaults probe doesn't apply, and the OSC 11 probe only runs for the auto theme — so detection falls back to dark and can mismatch.
  3. The band can never be made consistent. It only paints when the theme matches the terminal, and history is rendered through Ink <Static> (committed rows are never repainted). So switching theme leaves earlier messages with their original band/no-band state, and a single screen ends up with both — see repro.

Expected behavior

The input box and user-message area should blend into the terminal's own background across all terminals and themes — no theme-coloured fill block, and no inconsistency between messages.

Where it lives

  • packages/cli/src/ui/components/BaseTextInput.tsx — input box background fill.
  • packages/cli/src/ui/components/messages/ConversationMessages.tsxUserMessage half-line band.
  • packages/cli/src/ui/utils/theme-background.ts — the fill/match helpers.
  • packages/cli/src/ui/utils/software-cursor.ts — software cursor contrast derives from the same effective background.

Proposed fix

Stop painting both the input box and the user-message band; let them render on the terminal's own background, with user messages falling back to marginTop=1 for separation (consistent across all themes). Keep the software cursor visible by deriving its contrast from the terminal's detected brightness rather than from the now never-painted theme background.

This removes the half-line band's tighter spacing introduced in #4595 — an intentional trade-off, since a band that only renders in matching theme/terminal combinations can't be made consistent.

Metadata

Metadata

Assignees

Labels

category/uiUser interface and displaypriority/P2Medium - Moderately impactful, noticeable problemscope/componentsUI components and widgetsscope/renderingDisplay and rendering logicscope/themesTheme system and customizationtype/bugSomething isn't working as expectedwelcome-pr

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions