-
Notifications
You must be signed in to change notification settings - Fork 1
Description
Summary
The Arashiyama theme is a warm dark theme inspired by the bamboo groves of Kyoto's Arashiyama district. The overall concept is strong and the warmth reads well. However the terminal palette is inconsistent with the theme's character, some syntax colors are too vivid for the earthy surface, and the activity indicator palette diverges from the Canopy standard in ways that reduce comprehension.
Problem Statement
Arashiyama uses a warm, slightly dusty surface palette (#25211E canvas, #211D1A sidebar) with amber mid-tones. The concept is clear and the theme is more refined than most. Issues are in the details:
activity-active: #3F9366is set to the Canopy accent green (not the brighter#22c55eused by other themes) — this is intentional for a muted aesthetic, but may be too dim to clearly read as "running/active" in the worktree.activity-working: #C89A3Ais set to amber instead of the standard green — this changes the semantic meaning of "working" and may confuse users familiar with the Canopy convention.activity-waiting: #6B9CB8is a cool slate blue, which is coherent with the theme but is the only blue in the entire palette — it appears isolated and doesn't integrate with the rest of the warm-amber system.terminal-bright-red: #ED6D46is an orange-red that reads more like "warning" than "bright red" — the semantic mismatch exists here too (same issue as Fiordland).syntax-keyword: #E55A63is a saturated hot pink-red that feels too vivid against the earthy warm surface. It competes withsyntax-number: #ED6A32(also vivid warm-red), creating a monotone warm-vivid syntax palette where keywords and numbers are hard to differentiate.terminal-selection: #3D2418is a dark red-brown selection background — this can make selected text difficult to read in low-light terminal content.
Relevant code:
shared/theme/themes.ts#L452-L503— current Arashiyama token definitions
Desired Behavior
Arashiyama should feel like filtered light through bamboo: warm amber and green-gold mid-tones, deep dusty shadow surfaces, and the occasional flash of soft magenta (bamboo flower). The theme should:
- Restore standard semantic meaning to agent state colors, or clearly document the intentional deviation and ensure it remains readable.
- Have a syntax palette where keywords, strings, numbers, and functions are distinguishable at a glance — less reliance on saturated warm tones across multiple syntax categories.
- Terminal selection background should provide good contrast for selected text.
terminal-bright-redshould be a visually red variant.
Verification Workflow
- Apply:
await setAppTheme(window, "arashiyama"). - Screenshot + contrast measurement.
- Evaluate terminal color legibility and semantic correctness (normal vs. bright ANSI pairs should each be differentiable).
- AI visual review: does the bamboo grove character read clearly? Are syntax colors distinguishable?
npm run check.
Acceptance Criteria
- Agent state indicators (
activity-active,activity-working,activity-waiting,activity-idle) are clearly legible and distinct from each other against the Arashiyama canvas. -
terminal-bright-redis a red-family color (not orange). - Terminal selection background provides ≥ 3:1 contrast for typical foreground text on Arashiyama canvas.
- Syntax categories — keyword, string, number, function — are visually distinguishable (distinct enough in hue or lightness to be told apart).
- The theme's bamboo/amber character is preserved and legible in a screenshot evaluation.
- All E2E tests pass.
Edge Cases & Risks
- Arashiyama intentionally deviates from the standard activity color convention. Any changes here should be a deliberate design decision, not an inadvertent normalization.
- Terminal scheme pairing from PR feat(terminal): match terminal color scheme to app theme automatically #3345 — verify cohesion after changes.