ColorInput

A color picker field. The inspector renders a swatch that opens a full color picker on click.

Runtime value: string (hex, e.g. "#ff0000")

Declaration

import { Behaviour, type ColorInput } from "@relu-interactives/spatial-ecs";

export default class Demo extends Behaviour {
  data = {
    tint:     "#ffffff" as ColorInput,
    emissive: "#000000" as ColorInput,
  };
}

Runtime usage

Use the value directly as a hex string:

import * as THREE from "three";

init() {
  const color = new THREE.Color(this.data.tint);
  // apply to a material, light, etc.
}

Notes

• Value must be a valid hex color string (#rgb, #rrggbb, or #rrggbbaa) — the inspector detects the format automatically and renders the color picker.
• Alpha is not included in the default 6-digit form — use a separate FloatInput if you need opacity control.