Skip to content

Add configurable syntax tokens for XML/HTML tag highlighting #6128

@CasualDeveloper

Description

@CasualDeveloper

Problem

XML/HTML tags are styled using hardcoded color mappings in getSyntaxRules():

{ scope: ["tag"], style: { foreground: theme.error } },
{ scope: ["tag.attribute"], style: { foreground: theme.syntaxKeyword } },
{ scope: ["tag.delimiter"], style: { foreground: theme.syntaxOperator } },

This means custom themes cannot independently control tag colors—they inherit from unrelated tokens (error, syntaxKeyword, syntaxOperator).

Proposed Solution

Add three new optional theme tokens:

  • syntaxTag - for tag names (<div>, <span>)
  • syntaxAttribute - for attributes (class=, href=)
  • syntaxTagDelimiter - for delimiters (<, >, />)

These would be optional with backward-compatible fallbacks to the current hardcoded values.

Files to Modify

  • packages/opencode/src/cli/cmd/tui/context/theme.tsx
  • packages/web/public/theme.json (schema)
  • packages/opencode/src/cli/cmd/tui/context/theme/opencode.json

Metadata

Metadata

Assignees

Labels

opentuiThis relates to changes in v1.0, now that opencode uses opentui

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions