Skip to content

Redesign Galápagos theme — clarify dark teal-sea identity #3352

@gregpriday

Description

@gregpriday

Summary

The Galápagos theme is a dark teal-sea theme inspired by the volcanic islands. The surface palette is good, but the syntax highlighting palette lacks coherence, several terminal colors are indistinguishable from each other, and the theme's identity isn't clearly expressed in its accent and highlight choices.

Problem Statement

Galápagos uses #131A1C canvas and #0F1416 sidebar — a dark teal-charcoal that works well. The issues are in the detail layers:

  • syntax-punctuation: #6E8690 is very close to syntax-comment: #7D9194 — both are mid-grey teal, making code comments and punctuation look nearly identical. Code becomes hard to parse at a glance.
  • syntax-keyword: #4ECDC8 (a bright cyan-teal) and syntax-operator: #8BBFC8 (a lighter blue-teal) are both in the cyan family. With the teal surface background, these syntax roles merge visually with the environment rather than standing out from it.
  • terminal-yellow: #9B8E67 and terminal-green: #3F9366 are both muted and dark — they risk failing contrast against the Galápagos canvas. terminal-blue: #6585A4 and terminal-cyan: #528B8B are similarly dark.
  • activity-active and activity-working both use #22c55e — the standard Canopy green. On a teal-dark surface this works but feels generic. The Galápagos could have a more adapted "tropical water" active color (e.g. a brighter cyan) while keeping the same semantic meaning.
  • The syntax-chip: #C8A055 is a warm amber that appears isolated — it's the only warm-toned token in an otherwise cool palette, making it look out of place.
  • The theme's identity (volcanic islands, tropical ocean, iguana green) is not coherently expressed. The palette reads as "generic teal dark" rather than specifically Galápagos.

Relevant code:

Desired Behavior

Galápagos should feel like the deep Pacific: dark volcanic surfaces with bright tropical-water teal and cyan highlights, and the occasional marine life amber-green. It should:

  • Have clearly differentiable syntax categories — especially punctuation vs. comment, and keyword vs. operator.
  • Terminal ANSI colors should all pass ≥ 3:1 contrast against the canvas.
  • The cool teal palette should be coherent throughout — warm intrusions (like the amber chip) should either be removed or integrated into a narrative.
  • The theme should be immediately distinguishable from Fiordland (darker, colder, more angular) in a side-by-side comparison.

Verification Workflow

  1. Apply: await setAppTheme(window, "galapagos").
  2. Screenshot + contrast measurement.
  3. Measure all 8 normal ANSI terminal colors against canvas.
  4. AI visual review: does the theme convey tropical ocean? Is it distinct from Fiordland? Are syntax roles differentiable?
  5. npm run check.

Acceptance Criteria

  • syntax-punctuation and syntax-comment are visually distinct (different hue or at least 20% lightness difference).
  • syntax-keyword and syntax-operator are visually distinct.
  • All 8 normal ANSI terminal colors achieve ≥ 3:1 contrast against surface-canvas.
  • The theme reads as a coherent tropical-ocean dark theme, distinct from Fiordland, in screenshot evaluation.
  • All E2E tests pass.

Edge Cases & Risks

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions