decentraland / decentraland/godot-explorer

UI Componentization - Unify color sources using GDScript themes

Open
#1,877 0 comments 0 reactions 1 assignee Assigned to @sdilauro View on GitHub
claw-created
Dominant language
Rust
Stars
18
Forks
19
Avg merge
4d 2h
Merged PRs (30d)
43

Description

## Context

Colors are currently scattered across the codebase — hardcoded in scenes, duplicated across scripts, and inconsistent between UI components. This makes theme changes painful, error-prone, and hard to automate (including AI-driven theme tweaks).

## Goals

1. **Establish a single source of truth for colors** defined programmatically via GDScript, instead of relying on hardcoded values in `.tscn` files, inline `modulate` properties, or scattered `Color(...)` literals.

2. **Use Godot's theme system** (`Theme` resources + `StyleBox`) as the delivery mechanism, so any Control node picks up colors automatically via inheritance/variations rather than per-scene overrides.

3. **Adopt semantic color naming** (e.g. `primary`, `surface`, `text_primary`, `danger`, `focus`) instead of literal names like `blue_1` or `light_gray`, so swapping palettes doesn't require touching every component.

4. **Investigate [ThemeGen](https://github.com/Inspiaaa/ThemeGen)** as a candidate solution:
- Lets you define themes fully in GDScript (`@tool` scripts extending `ProgrammaticTheme`), which is ideal for AI-assisted editing — an agent can read/write a `.gd` file far more reliably than a binary-ish `.tres`.
- Supports **theme variants** via multiple `setup_*` functions sharing a single `define_theme()` — natural fit for light/dark/high-contrast/AI-generated palettes.
- Supports StyleBox inheritance (`inherit`, `merge`), shortcut helpers (`border_width`, `corner_radius`, `content_margins`), and custom style variations.
- Has a **Save Sync** plugin for live preview — theme regenerates on script save.
- MIT-licensed, Godot 4.x, ~215 stars, single-author project (evaluate maintenance risk).

## Tasks

- Audit current color usage: grep for `Color(`, `modulate`, and inline hex values; list hotspots.
- Define the semantic color palette (names + values for at least one base variant).
- Evaluate ThemeGen vs. alternatives (hand-rolled `@tool` script, plain `.tres` files, other addons) — proof of concept with 2–3 representative components.
- Document the chosen workflow so AI agents can reliably edit the theme file (which file to edit, where variables live, how to regenerate).

## Acceptance Criteria

- A single `.gd` file (or small set) where all colors are declared as named variables.
- At least one generated `Theme` resource consumed by the UI root, no per-scene color overrides remaining in the migrated components.
- At least one alternate variant working (e.g. dark theme) to validate the multi-palette flow.
- A short ADR or README section justifying the chosen approach.

## Related Issues

- #1617 — Godot UI Theme Componentization (addresses the broader theme structure; this issue focuses specifically on color unification)

---
Requested by Mateo via Slack

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.