Skip to content

fix(theme): dark mode goes back to the stock neutral ground and text - #240

Merged
kateebonner merged 1 commit into
local/amicodefrom
kate/dark-mode-neutral-ground
Aug 23, 2026
Merged

fix(theme): dark mode goes back to the stock neutral ground and text#240
kateebonner merged 1 commit into
local/amicodefrom
kate/dark-mode-neutral-ground

Conversation

@kateebonner

@kateebonner kateebonner commented Aug 23, 2026

Copy link
Copy Markdown
Contributor

Follow-up to #235.

The brand re-theme carried the site's cream/olive palette into the dark variant as well as the light one. Cream reads as a deliberate warm surface on white; on a dark ground it reads as a colour cast, and next to the surrounding VS Code chrome the app looked like it belonged to a different product. Reported in review as jarring and out of place.

Dark backgrounds, text, icons and borders return to the values they had before the re-theme.

What moved

File Change
packages/ui/src/theme/themes/harmoniqs.json (dark only) grey ramp 50–1200, the text/icon steps riding on it, the legacy surface-* / text-* / border-* / icon-* overrides, and palette.neutral + palette.ink
packages/app/public/oc-theme-preload.js pre-paint ground #0F0F0D#080808, so the first frame isn't warm either
packages/app/src/components/terminal.tsx default dark terminal back to #191515 / #d4d4d4

palette.neutral and palette.ink are the load-bearing pair — they seed generateNeutralScale, so they tint every neutral the explicit overrides don't pin. Reverting only the override list would have left the derived tokens warm.

Borders and icons came along with "background and text": the borders were cream alphas at 22%, and once the ramp goes neutral they'd have been the last warm thing on screen. Two text colours that the re-theme had neutralised into cream also revert — syntax-constant, and palette.info, which drives markdown link text in chat.

What is deliberately untouched

  • Yellow accent #FFE614 in every accent role
  • Semantic green / red / warning ramps and the status dots
  • The yellow selection fill (surface-interactive-weak)
  • The entire light variant
  • --fg-on-dark in design-polish.css — that's content on fixed dark scrims (poster art, media overlays) in both schemes, not dark-mode chrome

Verification

Both variants resolved through resolve.ts and diffed against oc-2:

  • Every neutral background / text / border / icon token is byte-identical to oc-2
  • All 82 remaining differences are accent- or status-derived (border-*-selected, surface-brand-*, icon-agent-*) and were confirmed unchanged by this commit

check:design passes · ui tests 453 pass / 0 fail · theme-preload tests 4 pass / 0 fail · packages/ui and packages/app typecheck clean.

npm run lint reports 1 error in packages/app/e2e/performance/timeline/session-timeline-benchmark.fixture.ts — pre-existing on local/amicode, unrelated to this change.

Summary by CodeRabbit

  • Style
    • Refreshed dark-mode colors across the app for a more neutral, modern appearance.
    • Updated terminal fallback colors, including background, text, and cursor contrast.
    • Revised the Harmoniqs dark theme with gray surfaces and pink/cyan accent colors.
    • Light mode colors remain unchanged.

The brand re-theme (#235) carried the site's cream/olive palette into the
dark variant as well as the light one. Cream reads as a deliberate warm
surface on white; on a dark ground it reads as a colour cast, and next to
the surrounding VS Code chrome the app looked like it belonged to a
different product.

Dark backgrounds, text, icons and borders return to the values they had
before the re-theme (oc-2's neutral ramp) — greys 50-1200, the text and
icon steps that ride on them, the legacy surface/text/border overrides,
and palette.neutral/ink, which seed everything the overrides do not pin.
The pre-paint literal and the terminal's default dark colours follow, so
the first frame and the terminal surface match the app again.

The brand is untouched: yellow accent (#FFE614) in every accent role, the
semantic green/red/warning ramps, the status dots, the yellow selection
fill, and the whole light variant stay exactly as merged. Verified by
resolving both variants — every neutral background/text/border/icon token
is now byte-identical to oc-2, and every remaining difference is an
accent- or status-derived token.
@coderabbitai

coderabbitai Bot commented Aug 23, 2026

Copy link
Copy Markdown

Review Change Stack

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: 734e03a0-956a-40ab-8f09-c53e462cd5d3

📥 Commits

Reviewing files that changed from the base of the PR and between 863f3cc and 2c8470c.

📒 Files selected for processing (3)
  • packages/app/public/oc-theme-preload.js
  • packages/app/src/components/terminal.tsx
  • packages/ui/src/theme/themes/harmoniqs.json

Included review availability: Your plan provides up to 10 included reviews per hour; 8 remain after this review.


📝 Walkthrough

Walkthrough

The pull request updates dark-mode colors in the Harmoniqs theme, application preload, and terminal fallback. Light-mode colors remain unchanged.

Changes

Dark theme palette

Layer / File(s) Summary
Harmoniqs theme palette tokens
packages/ui/src/theme/themes/harmoniqs.json
The dark palette now uses neutral gray values with pink and cyan accents. Syntax, grayscale, text, icon, surface, and border tokens were updated.
Application dark-mode colors
packages/app/public/oc-theme-preload.js, packages/app/src/components/terminal.tsx
The dark preload and browser theme color use #080808. Terminal fallback colors use a dark brown background with light gray foreground and cursor colors.

Estimated code review effort: 2 (Simple) | ~10 minutes

Merge Risk: ⚪ Minimal · up to 2c847

The change restores dark-mode backgrounds, text, borders, icons, preload color, and terminal defaults to the stock neutral values while leaving light mode and accents unchanged. No actionable merge-blocking risk remains after normal checks and review.

Suggested reviewers: brendonovich, hona

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed The title clearly summarizes the primary change: restoring neutral colors in dark mode.
Description check ✅ Passed The description clearly explains the issue, changes, preserved behavior, and verification results, but omits several template headings and checklist items.
Docstring Coverage ✅ Passed Docstring check was indeterminate for this PR — some files could not be analyzed in time. Not blocking.
Linked Issues check ✅ Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check ✅ Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches
📝 Generate docstrings
  • Create stacked PR
  • Commit on current branch
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch kate/dark-mode-neutral-ground

Comment @coderabbitai help to get the list of available commands.

@kateebonner
kateebonner merged commit d6ab169 into local/amicode Aug 23, 2026
2 of 3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant