Color constants

The named colors a chart accepts in an Indicator's declarations, where a name is refused and a hex form is required, and how to build a palette array for per-bar coloring. kScript (legacy) shipped a table of named constants usable in any colors=[...] array; an Indicator writes the same names as string literals on outputs, segments, renderers, and borders, and writes hex on anything that takes an opacity.

Available named colors

The chart interprets a declared color string as a CSS color, so the familiar names work on every surface that does not blend a fill. The names kScript documented, with the hex value each one stands for:

Write the hex value instead of the name and the result is identical on every surface, including the one that refuses names. That is the habit this tree's examples follow.

Where a name is accepted, and where it is refused

Alpha rides in the color itself as an eight-digit hex (#2563eb33) or an rgba() / hsla() form, or on top through the opacity option (0..1) of an output, a box, or a range. The two compose: a box with color: "#2563eb" and opacity: 0.15 fills at fifteen percent.

Using colors in your Indicators

Single color

Use one color per output for simple lines. A name and its hex are interchangeable here:

output("sma20", line, overlay, { color: "orange", width: 2 });
output("sma50", line, overlay, { color: "#FFA500", width: 2 });   // the same orange

Multi-color Indicators

Combine colors across outputs for a multi-line study. Each line owns its color; there is no shared array with a colorIndex argument:

output("sma10", line, overlay, { color: "blue", width: 2 });
output("sma20", line, overlay, { color: "orange", width: 2 });
output("sma50", line, overlay, { color: "green", width: 2 });

Conditional colors

kScript switched a line's color per bar with colors=[...] and a computed colorIndex. An Indicator declares the palette on the output as colors and names a data-only output as color_by; that output's per-bar value (floored) indexes the palette, and a missing or out-of-range index falls back to entry 0. An output cannot color itself, so the decision is its own output. RSI colored by level, with a named color in the palette to show the names are accepted there:

import { input, line, lower, none, ohlcv, output, param } from "./sdk/declare";
import { in_close } from "./gen/inputs";
import { emitRow, out_level, out_rsi } from "./gen/outputs";
import { p_period } from "./gen/params";
import { Rsi } from "./sdk/ta";

param("period", 14, { min: 2, max: 200, description: "RSI length" });
input("close", ohlcv.close);
// colors is the palette; level picks the entry per bar: 0 red (overbought), 1 green (oversold), 2 blue (neutral).
output("rsi", line, lower, { width: 2, color_by: "level", colors: ["#FF0000", "green", "#0000FF"], description: "RSI with conditional colors" });
output("level", none, lower, { description: "0 above 70, 1 below 30, 2 in between" });

let rsi = new Rsi(14);
let value: f64 = NaN;

export function init(): void {
  rsi = new Rsi(i32(p_period()));
}

export function state(): i32 {
  value = rsi.update(in_close());
  return isNaN(value) ? 0 : 1;
}

export function finalize(): void {
  out_rsi(value);
  out_level(value > 70.0 ? 0.0 : value < 30.0 ? 1.0 : 2.0);
  emitRow();
}

export function reset(): void {
  rsi.reset();
  value = NaN;
}

The ladder is a bucket ladder, not a gradient: a continuous color from a value is not in Indicators yet (functions/color-functions.md), and the worked alternative is a palette with as many entries as you want buckets. width_by with a widths array is the same ladder for line width.

Recommended palettes

Pre-designed combinations that work well together, written as the colors array of a color_by output or spread across several outputs.

Trading signals

Classic colors for buy/sell signals and trend indicators:

colors: ["green", "red", "blue"]

Technical analysis

Professional colors for technical indicators and overlays:

colors: ["orange", "purple", "teal"]

Volume analysis

Distinct colors for volume-based indicators:

colors: ["lime", "yellow", "fuchsia"]

The tree's own palette

The worked examples across this documentation use one muted set that reads on dark and light chart themes alike: #2563eb blue, #16a34a green, #dc2626 red, #f59e0b amber, #7c3aed violet, #94a3b8 slate for reference lines, and #22d3a5 / #ff5b7f for bull and bear tints.

Best practices

• Consistent branding. Use the same color scheme across related Indicators; a package's colors are declarations, so they are easy to keep aligned across versions.
• Accessibility. Choose colors with enough contrast, and never rely on color alone: a shape mark or a data-only output carries the same decision for anyone who cannot see the tint (and for an alert, which cannot see it at all).
• Semantic colors. Green for bullish signals and positive values, red for bearish signals and losses, blue for neutral indicators and reference lines, orange or yellow for warnings.
• Hex on anything with a fill. A box's color must be hex, rgb(), or hsl(); writing hex everywhere means never meeting that refusal.