VS Code extension: input focus outline in red/terracotta reads as an error state
Feedback
The Claude Code panel's input box shows a red/terracotta (salmon) outline when focused. Presumably this is the Anthropic brand accent — but as a focus ring around a text input, a red-family outline reads as error / danger / something is wrong rather than "active." My honest first reaction on seeing it: "it feels dangerous and like something is wrong."
Decades of UI convention reserve red outlines on inputs for validation errors and destructive states. Using it as the default focus indicator makes the resting state of the tool feel like an alarm state.
Suggestion
Stay in the brand family — just gentler. After experimenting locally, a softer, lighter orange (think desaturated peach/amber terracotta, e.g. somewhere around #e0a184) keeps the ring unmistakably Anthropic while completely losing the error-state read. The warmth is on-brand; it's specifically the saturation/red-leaning intensity that collides with the error convention and feels psychologically uncomfortable.
Also worth doing either way:
- Inherit the editor theme's
focusBordertoken so the ring follows user themes /workbench.colorCustomizations, or - Expose the accent as an extension setting.
Environment
- Claude Code VS Code extension (panel location), macOS, Dark Modern theme.
---
Filed with Claude Code on the user's behalf.