Repository navigation
feat: Arduino Agent colors (Arduino's teal moved to the icon's indigo) - #44
Merged
Merged
Conversation
The new name and icon set Arduino Agent apart, but inside it still wore Arduino's teal everywhere. Its light and dark themes now use the indigo of the app icon. - agent-palette.ts: pure OKLCH color math. Teal accents (hue 160-240, chroma >= 0.05) take the icon's hue at their original lightness, with a bit more chroma; teal-tinted neutrals keep lightness and their tiny chroma but lean indigo; everything else is untouched. Same lightness keeps the contrast Arduino tuned. - agent-theme.ts: registers the converted themes under Arduino's ids (arduino-theme / arduino-theme-dark), which the settings dialog lists as the built-in Light/Dark and users' saved preference keeps pointing at. Computed from Arduino's JSON at registration, so upstream theme updates carry over. - Registers arduino.branding.primary/secondary. Arduino's themes set them and its CSS uses var(--theia-arduino-branding-primary) (boards dialog, library/board lists, serial monitor scrollbar, progress bar), but upstream never registered them, so the variable was undefined and those accents never rendered. - Overrides the few rules in arduino-ide-extension's CSS that hardcode teal (board/port status bar items, dialog border, list separators, focus shadow) in terms of the branding color. - Unit tests for the palette (yarn test:palette). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
The name, icon and title already set Arduino Agent apart, but inside it still used Arduino's teal everywhere. This PR moves both built-in themes to the indigo of the app icon.
How the colors are derived (
agent-palette.ts, pure OKLCH math): instead of hand-picking a palette, Arduino's own theme JSON is transformed when the themes are registered.#008184→#5d64c6,#0ca1a6→#757ff4, and the status bar#006d70→#4e54a8.#1f272a→#24252c.Wiring (
agent-theme.ts)arduino-theme,arduino-theme-dark). The vendored settings dialog lists exactly those as the built-in Light/Dark, and users' savedworkbench.colorThemekeeps working. Since the conversion runs on Arduino's JSON at registration, upstream theme updates carry over.arduino.branding.primary/secondaryare now registered. Arduino's themes set them, and its CSS usesvar(--theia-arduino-branding-primary)in the boards dialog, the library and board lists, the serial monitor scrollbar and the progress bar. But upstream never registers them, so the variable was undefined in every build and those accents never rendered.Test plan
yarn test:palette(new) passes 4/4:prefers-color-schemeand reloading, so nothing was persisted.--theia-arduino-branding-primaryis now defined (#5d64c6light,#757ff4dark). It was empty before.🤖 Generated with Claude Code