Skip to content

feat(theme): custom themes can use calculated system colors#6321

Closed
nihil2501 wants to merge 16 commits intoanomalyco:devfrom
nihil2501:system-theme-colors
Closed

feat(theme): custom themes can use calculated system colors#6321
nihil2501 wants to merge 16 commits intoanomalyco:devfrom
nihil2501:system-theme-colors

Conversation

@nihil2501
Copy link

@nihil2501 nihil2501 commented Dec 28, 2025

GH Issue

This makes it possible for custom themes to configure specific theme colors to use the calculated system values, e.g.:

{ "theme": { "accent": "system", "background": "#000000" } }

Example

In this example, pop-dark.json, I have a custom theme which sets specific syntax colors, but falls back to "system" for everything else. This "extreme" example shows syntax highlighting I took from Helix's "Pop Dark" theme, and everything else OpenCode is deriving given that Ghostty's theme is set to "HaX0R Blue".

Screenshot 2025-12-28 at 5 57 00 PM

Description

OpenCode themes address UI concepts that don't necessarily exist in themes for other tools like Helix, e.g.:

  • backgroundElement
  • backgroundMenu
  • backgroundPanel
  • border
  • borderActive
  • borderSubtle

In my case, I wanted to make a custom theme that matches what I have in Helix. I also already have terminal ANSI colors that match my Helix theme. Rather than go through the manual work to choose colors for every slot OpenCode offers, this change lets you customize some colors, while falling back to the values of the calculated system theme for the rest.

Commits

This PR has a series of preliminary refactor and fix commits that set up the implementation of the feature. The preliminary refactor half of this change might be desirable to merge on its own terms, even if the feature request is rejected.

Preliminary fixes

Admittedly the two fixes are not directly about the feature, but maybe they're welcome to be brought in with the rest of the changes to this file:

  • fix(theme): system light & dark
    • system theme now reacts to Toggle appearance
  • fix(theme): custom theme load error fallback
    • Stops custom theme loading error handling from switching away from themes that don't depend on custom themes

Feature implementation

The rest of the non-refactor commits implement the feature:

  • feat(theme): add "system" color value to theme schema
  • feat(theme): init considers system-like custom themes
  • feat(theme): resolveTheme resolves "system"

@nihil2501 nihil2501 changed the title feat(theme): custom themes can use system colors feat(theme): custom themes can use calculated system colors Dec 29, 2025
@nihil2501 nihil2501 changed the title feat(theme): custom themes can use calculated system colors feat(theme): custom themes can use calculated system colors Dec 29, 2025
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

Comments