fix: bake node color into canvas texture to preserve emoji colors

src/core/CoreTextNode.ts

@@ -6,7 +6,7 @@ import type {
   TextRenderInfo,
   SdfVertexCache,
 } from './text-rendering/TextRenderer.js';
-import { USE_RTT } from '../utils.js';
+import { USE_RTT, premultiplyColorABGR } from '../utils.js';
 import {
   CoreNode,
   CoreNodeRenderState,
@@ -300,8 +300,15 @@ export class CoreTextNode extends CoreNode implements CoreTextNodeProps {
         return;
     }
 
-    // Canvas renderer: use standard texture rendering via CoreNode
+    // Canvas renderer: color is baked into the texture to preserve
+    // native emoji colors. Use white tint with worldAlpha only.
     if (this._type === 'canvas') {
+      const white = premultiplyColorABGR(0xffffffff, this.worldAlpha);
+      this.premultipliedColorTl =
+        this.premultipliedColorTr =
+        this.premultipliedColorBl =
+        this.premultipliedColorBr =
+          white;
       super.renderQuads(renderer);
       return;
     }
@@ -558,6 +565,18 @@ export class CoreTextNode extends CoreNode implements CoreTextNodeProps {
     }
   }
 
+  override get color(): number {
+    return this.props.color;
+  }
+
+  override set color(value: number) {
+    super.color = value;
+    if (this._type === 'canvas') {
+      this._layoutGenerated = false;
+      this.setUpdateType(UpdateType.Local);
+    }
+  }
+
   get forceLoad() {
     return this.textProps.forceLoad;
   }

src/core/text-rendering/CanvasTextRenderer.ts

@@ -130,7 +130,12 @@ const renderText = (props: CoreTextNodeProps): TextRenderInfo => {
 
   canvas.width = canvasW;
   canvas.height = canvasH;
-  context.fillStyle = 'white';
+  const color = props.color ?? 0xffffffff;
+  const r = (color >>> 24) & 0xff;
+  const g = (color >>> 16) & 0xff;
+  const b = (color >>> 8) & 0xff;
+  const a = color & 0xff;
+  context.fillStyle = `rgba(${r},${g},${b},${a / 255})`;
   context.font = font;
   context.textBaseline = 'hanging';