Skip to content

Adopt Mac 0.70.0 provider brand colors - #822

Merged
Finesssee merged 8 commits into
mainfrom
feat/mac-card-palette
Oct 11, 2026
Merged

Finesssee merged 8 commits into
mainfrom
feat/mac-card-palette

Conversation

@Finesssee

@Finesssee Finesssee commented Oct 11, 2026 •

Copy link
Copy Markdown
Collaborator

Summary

Card PR 4 of the Mac-parity port. Provider brand colors on Windows now match Mac CodexBar 0.70.0 for tray-card bars, provider icons and chart series (spec tray-card-spec.md §4, §6.2 item 4, §7.5). Vercel keeps #737373 (user decision, 2026-10-10). --provider-accent is still always set on the card root (from #813).

The palette has three copies: Rust ProviderId::brand_color, TS PROVIDER_ICON_REGISTRY and the --chart-<id> tokens in styles.css. providerIcons.test.ts checks that they agree. This PR changes all three together, so no new source of truth was needed.

Color changes

Provider Old New (Mac 0.70.0)
Chutes #FF5C35 #3184FF
Deepgram #13EF93 #6467F2
Doubao #2563EB #3370FF
Grok #111827 #10A37F
Groq #F55036 #F56844
Helmcode #4F46E5 #4934E1
Kilo #5D87FF #F27027
LiteLLM #0EA5E9 #4C89F0
LLMProxy #4F46E5 #24B47E
Ollama #8B95B0 #888888
OpenAI API #10A37F #0F826E
OpenRouter #6B7280 #6467F2
Perplexity #1FB8CD #20B2AA
Poe #5D5FEF #5D5CDE
Qoder #2563EB #10B981
Sakana #0EA5E9 #2975DB
StepFun #999999 #2196F2
T3 Chat #8B5CF6 #F56647
TypeSafe #2563EB #111111
v0 #111827 #111111
Warp #6366F1 #938BB4
Wayfinder #14B8A6 #10A37F
Windsurf #22C55E #34E8BB
Zed #084CCF #084EFF
ElevenLabs bars #111827 bars use the label color (--mac-text); icon stays #111827
Vercel #737373 unchanged (#737373, Mac uses white)

Chart tokens: deepgram, grok, groq, llmproxy and windsurf follow the new colors. xAI used to share --chart-grok. Grok's token is no longer black, so xAI gets its own --chart-xai (#8E8E93).

MenuCard now takes its bar color from providerBarAccent(id, override). It returns the user's accent override if one is set, then the label color for label-styled providers (ElevenLabs), then the brand color.

Test changes and why

  • Rust provider.rs.
    • New MAC_PARITY_ACCENTS (id, old, new) table.
    • New mac_parity_accents_are_pinned test. It pins every new hex and also asserts that Vercel stays #737373.
  • Rust contrast guard. The existing rule is unchanged. An accent passes if it has at least 3:1 contrast, or if it loses less than 0.5 contrast against its previous accent, on #FFFFFF and #222222.
    • The new test mac_parity_accents_do_not_materially_regress_contrast applies this rule to all 24 changes.
    • Four are listed explicitly in MAC_PARITY_CONTRAST_EXEMPTIONS, because they are the exact Mac colors and the user chose Mac colors:
      • LLMProxy on white: 6.29 to 2.66.
      • Qoder on white: 5.17 to 2.54.
      • Windsurf on white: 2.28 to 1.57.
      • TypeSafe on #222222: 3.08 to 1.19.
    • The test asserts passes != exempt. An exemption that becomes unnecessary therefore also fails, so the list cannot grow silently.
    • These colors are used as bar fills and icon tints, not as body text, and no existing text-contrast test was changed.
    • One exception: providers without an SVG icon show a letter glyph colored with the brand color (.provider-icon--letter, styles.css). TypeSafe ("T") is one of them, so on dark surfaces its glyph drops from 3.08 to 1.19 against #222222. v0 ("V") was already near-black (#111827), so it was already in this state.
  • providerIcons.test.ts.
    • Added a check that the Mac parity list matches the registry.
    • Added a check that Vercel stays #737373.
    • Added an ElevenLabs label-bar test (the icon stays #111827).
    • Added a test that the override takes precedence.
    • The grok exception in the chart-token sync test is gone, because grok's token now matches its brand color. The token list adds deepgram, grok, groq, llmproxy, windsurf and xai.
  • chartPalette.test.ts. New test that xai and grok map to separate tokens.

Commands run

Command Result
cargo fmt --all clean
cargo test --manifest-path rust/Cargo.toml 3815 passed, 0 failed, 1 ignored (lib), plus the other targets green
cargo clippy --manifest-path rust/Cargo.toml --all-targets -- -D warnings clean
cargo test --manifest-path apps/desktop-tauri/src-tauri/Cargo.toml 642 passed
cargo clippy --manifest-path apps/desktop-tauri/src-tauri/Cargo.toml --all-targets -- -D warnings clean
pnpm test (apps/desktop-tauri) 109 files, 879 tests passed
pnpm run build tsc and vite build OK

Proof

I built a local desktop exe twice, once from main (f54421c3b) and once from this branch, and captured the tray panel for 18 synthetic-data packs with each: Claude, Codex, OpenRouter, Copilot, Cursor, Vercel, Gemini, Kilo, Qoder, Chutes, T3Chat, ElevenLabs, Grok, Windsurf, Deepgram, LLMProxy, TypeSafe and StepFun.

For each pack, a side-by-side sheet shows Mac 0.70.0, Windows main and this PR. I counted pixels near the old and new hex in each Windows panel (old px / new px):

  • The six unchanged providers render identically: Claude, Codex, Copilot, Cursor, Gemini and Vercel.
  • Every changed provider moves from the old hex to the new one. For example:
    • Kilo: 8788/0 on main, 0/8780 here.
    • OpenRouter: 28246/0 on main, 2112/26134 here.
    • Windsurf: 7696/0 on main, 0/7696 here.
    • Deepgram: 18580/0 on main, 0/18580 here.
  • ElevenLabs bars render in the dark label color.

Sheets (Mac 0.70.0 | Windows main | this PR), at W:/mac-parity/report/card-palette/<Pack>.png on the proof host: Claude, Codex, OpenRouter, Copilot, Cursor, Vercel, Gemini, Kilo, Qoder, Chutes, T3Chat, ElevenLabs, Grok, Windsurf, Deepgram, LLMProxy, TypeSafe, StepFun.

Limit: no CUA tray check. The captures show the WebView content, captured through CDP. I did not run a CUA check of the native tray. Only two places call Rust brand_color: Settings::effective_accent_color (rust/src/settings.rs), which nothing calls, and a Hyper test. Nothing under rust/src/tray/, tray_bridge.rs or floatbar/ calls it. So the tray icon pixels should be unchanged. The float bar border and the provider icons take their color from the TS registry, so they do change.

Open questions

  • TypeSafe and v0 are now #111111, as on the Mac. Their icon tints are almost invisible on dark surfaces such as the Settings sidebar and the float bar. v0 and Grok were already near-black (#111827) before this PR.
  • Windsurf, Qoder and LLMProxy have low contrast on the #DEDEE2 card. This matches the Mac.
  • For ElevenLabs bars, a user accent override wins on Windows. On the Mac the label style ignores overrides. I kept the override because Windows exposes an accent picker.
  • The Grok switcher icon renders as a dark square, because its SVG does not use currentColor. The palette-base capture shows it was already the case on main.
  • The spec counts 25 differences. This PR has 24 hex changes, plus the ElevenLabs label rule, plus Vercel kept on purpose.

Summary by CodeRabbit

  • Visual Updates
    • Provider icons and floating-bar accents now better reflect provider branding across light and dark surfaces, with improved visibility for darker brand colors.
    • Updated provider colors across charts and interface accents, including a distinct chart color for xAI.
  • Bug Fixes
    • Provider-specific chart colors and custom accent overrides are applied more consistently.
    • Improved contrast for provider branding in dark themes while preserving original colors in light themes.

@coderabbitai

coderabbitai Bot commented Oct 11, 2026 •

Copy link
Copy Markdown

Review in Change Stack →

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: Repository: nesszer/Win-CodexBar/.coderabbit.yaml
  • Review profile: ASSERTIVE
  • Plan: Advanced
  • Run ID: e2d3a826-ad0f-45a1-9044-cf4537f7b00b

📥 Commits

Reviewing files that changed from the base of the PR and between bb63368 and b326542.


📒 Files selected for processing (14)
  • apps/desktop-tauri/src/components/MenuCard.tsx
  • apps/desktop-tauri/src/components/charts/chartPalette.test.ts
  • apps/desktop-tauri/src/components/charts/chartPalette.ts
  • apps/desktop-tauri/src/components/providers/ProviderIcon.tsx
  • apps/desktop-tauri/src/components/providers/providerIcons.test.ts
  • apps/desktop-tauri/src/components/providers/providerIcons.ts
  • apps/desktop-tauri/src/floatbar/FloatBar.css
  • apps/desktop-tauri/src/floatbar/FloatBar.test.tsx
  • apps/desktop-tauri/src/floatbar/FloatBar.tsx
  • apps/desktop-tauri/src/lib/color.test.ts
  • apps/desktop-tauri/src/lib/color.ts
  • apps/desktop-tauri/src/lib/menuSelection.ts
  • apps/desktop-tauri/src/styles.css
  • rust/src/core/provider.rs

Included review availability: This review used your included allowance. Your plan provides up to 4 included reviews per hour; 2 remain after this review.



📝 Walkthrough

Walkthrough

Provider brand colors and chart tokens are updated across the Rust and desktop code. Shared color helpers calculate contrast and dark-surface tints. Provider accents, icons, menu selection, and floating-bar styles use the updated color logic.

Changes

Provider colors and styling

Layer / File(s) Summary
Provider palette and chart tokens
rust/src/core/provider.rs, apps/desktop-tauri/src/components/providers/providerIcons.ts, apps/desktop-tauri/src/components/providers/providerIcons.test.ts, apps/desktop-tauri/src/components/charts/chartPalette.ts, apps/desktop-tauri/src/components/charts/chartPalette.test.ts, apps/desktop-tauri/src/styles.css
Provider brand colors and chart tokens are updated. Tests check the palette values, chart tokens, and contrast rules. Vercel remains #737373.
Color calculations and contrast tint
apps/desktop-tauri/src/lib/color.ts, apps/desktop-tauri/src/lib/color.test.ts, apps/desktop-tauri/src/lib/menuSelection.ts, apps/desktop-tauri/src/components/providers/providerIcons.ts, apps/desktop-tauri/src/components/providers/providerIcons.test.ts
Shared helpers calculate luminance and contrast and mix colors with white. Dark-surface tint calculation uses these helpers. Menu selection uses the shared luminance helper.
Provider accents and icon themes
apps/desktop-tauri/src/components/providers/providerIcons.ts, apps/desktop-tauri/src/components/providers/ProviderIcon.tsx, apps/desktop-tauri/src/components/providers/providerIcons.test.ts, apps/desktop-tauri/src/components/MenuCard.tsx, apps/desktop-tauri/src/styles.css
Provider bar accents use overrides when provided and use the label color for ElevenLabs by default. Icons apply brand colors and use a dark tint when available. Theme-specific styles and tests cover these rules.
Floating-bar brand styling
apps/desktop-tauri/src/floatbar/FloatBar.tsx, apps/desktop-tauri/src/floatbar/FloatBar.css, apps/desktop-tauri/src/floatbar/FloatBar.test.tsx, apps/desktop-tauri/src/components/providers/providerIcons.test.ts
Cost and provider pills apply brand colors and optional dark tints. Floating icons and borders use dark-brand values when available. Tests cover TypeSafe and Grok styling.

Priority: ➖ Normal

Estimated code review effort: 3 (Moderate) | ~25 minutes

Change: Feature

Suggested reviewers: xuelongmu


Merge Risk: ⚪ Minimal · up to b3265

This change updates provider brand colors and adds a dark-surface tint for near-black icons. It is a visual change with low blast radius, and no actionable merge-blocking risk was found.


Caution

Pre-merge checks failed

Please resolve all errors before merging. Addressing warnings is optional.

  • Ignore

❌ Failed checks (1 error, 1 inconclusive)

Check name Status Explanation Resolution
Provider Data Stays Siloed Error The pull request adds provider-specific branching in shared TypeScript code. apps/desktop-tauri/src/components/providers/providerIcons.ts:371-381 defines `LABEL_COLORED_BARS = new Set(["elevenlabs"]… Remove the provider-ID membership branch from shared code. Store the optional bar-color or progress-color-style value as declarative metadata on the provider registry entry, such as an optional barColor field set for ElevenLabs, and make …
Ui Changes Include Windows Proof Inconclusive The PR changes visible UI code, including MenuCard, ProviderIcon, FloatBar, styles.css, and provider color logic. The supplied PR description is explicitly truncated before its validation/proo… Provide the complete PR description, then verify that it explicitly includes screenshots or a proof note from a fresh Windows build. If the omitted validation section has no such evidence, the check must fail.
✅ Passed checks (6 passed)
Check name Status Explanation
Description Check Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check Passed The title is a short imperative summary that accurately describes the pull request's main change: adopting Mac 0.70.0 provider brand colors.
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.
Secrets Handled Safely Passed The pull request changes provider colors, chart tokens, contrast helpers, UI styles, and synthetic tests. The reviewed diff adds no token, cookie, API key, OAuth credential, authorization header, cred…
No Unapproved Dependencies Passed The pull-request diff changes only source and test files. It does not modify any Cargo.toml, package.json, npm or yarn lockfile, or the pnpm packageManager pin. No dependency addition requires approva…

Full details: Provider Data Stays Siloed

Explanation

The pull request adds provider-specific branching in shared TypeScript code. apps/desktop-tauri/src/components/providers/providerIcons.ts:371-381 defines LABEL_COLORED_BARS = new Set(["elevenlabs"]) and branches on normalize(id) to select a special bar color. MenuCard.tsx:235 calls this shared helper for every provider. This matches the explicit prohibition on cross-provider branching outside the allowed Rust provider modules. The reviewed changes do not show identity, plan, account-label, or email leakage, but the branching condition is sufficient for failure.

Resolution

Remove the provider-ID membership branch from shared code. Store the optional bar-color or progress-color-style value as declarative metadata on the provider registry entry, such as an optional barColor field set for ElevenLabs, and make providerBarAccent return override ?? entry.barColor ?? entry.brandColor through generic property lookup. Keep the override precedence and add tests for the metadata-driven behavior.


Full details: Ui Changes Include Windows Proof

Explanation

The PR changes visible UI code, including MenuCard, ProviderIcon, FloatBar, styles.css, and provider color logic. The supplied PR description is explicitly truncated before its validation/proof section. The objectives mention WebView and CUA captures, but they are a distilled summary and do not establish that the actual PR description includes screenshots or a proof note from a fresh Windows build.


  • Fix all pre-merge checks with AI
✨ Finishing Touches
📝 Generate docstrings
  • Commit to this branch
  • Create a new PR


🧪 Generate unit tests (beta)
  • Commit to this branch
  • Create a new PR

  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Warning

Some tools did not complete. Review the errors below.

🔧 React Doctor (0.9.14)

Project "apps/desktop-tauri" is not a workspace project or a directory. Available projects: desktop-tauri



Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

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

TypeSafe and V0 now use the Mac #111111, which vanishes on the dark
Settings window and the dark floating bar. ProviderIcon and the float bar
pills now add a lifted tint (brand mixed toward white until 3:1 on #222222)
for brands under 1.5:1 on #222222; dark scopes use it, light scopes,
including the tray card, keep the exact Mac color. The luminance math moves
to lib/color.ts and menuSelection reuses it.
@Finesssee

Copy link
Copy Markdown
Collaborator Author

Adversarial validation of this PR. I pushed three commits (da969f3..db07891).

The fix. The Mac palette makes TypeSafe and V0 #111111. On the dark surfaces (the float bar's default floating glass, and Settings > Providers in the sidebar and detail header), their marks almost disappeared:

  • TypeSafe on the float bar: 1.20:1 measured from the pixels. Its icon was missing in the capture.
  • Settings letter tiles: 1.35 to 1.43:1.

Commit 482404e adds brandColorOnDark:

  • It applies only to brands under 1.5:1 against #222222. It mixes them with white until they reach 3:1. #111111 becomes #707070.
  • It applies only under [data-theme="dark"] and on the non-light floating float bar.
  • The light tray card and the light-glass float bar keep the exact Mac values.
  • Brands it lifts: aixy, deepinfra, elevenlabs, manus, replicate, typesafe, v0. Of these, only TypeSafe is new with this PR; the others were already near-black on dark.
  • Tests pin literal values: #111111 to #707070, #000000 to #808080, #111827 to #70747d, and nulls for normal brands. They also pin the exact set of lifted brands and the order of the CSS rules.

After the fix (computed styles plus real cua-driver pixels, secondary monitor, synthetic scenario packs only):

  • Float bar, dark glass:
    • v0 and TypeSafe borders and icons are rgb(112,112,112).
    • Grok stays #10a37f.
    • TypeSafe icon pixels measure 2.76:1.
  • Float bar, light glass: v0 and TypeSafe stay #111111.
  • Settings tiles: 2.65 to 2.81:1.
  • Tray panel for TypeSafe, V0 and Grok: pixel-identical before and after the fix (0 differing pixels).

Proof (local, not committed): W:/mac-parity/win-runs/pr822-palette/{before,after}/ and .../tray/*-diff.png.

Checks on db07891 (includes main #811 and #816):

  • cargo fmt --check clean.
  • cargo test on both manifests: 4469 passed, 0 failed.
  • cargo clippy -D warnings on both manifests: clean.
  • pnpm test: 111 files, 917 tests passed.
  • pnpm run build: OK.

Other checks:

  • No tray or float-bar Rust path reads brand_color.
  • The contrast exemptions fail the test once a color passes, so they expire on their own.
  • Rust, TS and CSS palettes agree.
  • The user's override still wins.
  • xAI and Grok stay separate.

Pre-existing, not changed here:

  • The float bar and Settings sidebar ignore the user's accent override.
  • The ElevenLabs chart token rgb(17,24,39) is near-black on the dark Usage & Spend charts.

@coderabbitai coderabbitai Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pre-merge checks failed. Please resolve the failing checks before merging.

@Finesssee
Finesssee merged commit 5f6199a into main Oct 11, 2026
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