Skip to content

textmode.synth.js / cellColor

Function: cellColor()

Call Signature

ts
function cellColor(source): SynthSource;

Create a synth source with cell background color defined.

This function creates a SynthSource where the cell background color is driven by the provided source pattern. This is compositional and can be combined with char() and charColor().

Accepts either a SynthSource (pattern) or RGBA values (solid color).

Parameters

ParameterTypeDescription
sourceSynthSourceA SynthSource producing color values

Returns

SynthSource

A new SynthSource configured with cell color

Example

javascript
const t = textmode.create({
	width: window.innerWidth,
	height: window.innerHeight,
	plugins: [SynthPlugin],
});

t.layers.base.synth(cellColor(osc(6, 0.1, 1.2).invert()).char(noise(6)));

t.windowResized(() => {
	t.resizeCanvas(window.innerWidth, window.innerHeight);
});
codex avatar
@codex{ai-generated}Replace it with your own sketch, claim the credit, and climb the leaderboard.View sketch on GitHub

Call Signature

ts
function cellColor(
   r, 
   g?, 
   b?, 
   a?): SynthSource;

Create a synth source with cell background color defined using RGBA values.

Parameters

ParameterTypeDescription
rSynthParameterValueRed channel (0-1) or value
g?SynthParameterValueGreen channel (0-1) or value
b?SynthParameterValueBlue channel (0-1) or value
a?SynthParameterValueAlpha channel (0-1) or value

Returns

SynthSource

A new SynthSource configured with cell color

Example

javascript
const t = textmode.create({
	width: window.innerWidth,
	height: window.innerHeight,
	plugins: [SynthPlugin],
});

t.layers.base.synth(cellColor(0.05, 0.08, 0.1, 0.8).char(noise(10)));

t.windowResized(() => {
	t.resizeCanvas(window.innerWidth, window.innerHeight);
});
codex avatar
@codex{ai-generated}Replace it with your own sketch, claim the credit, and climb the leaderboard.View sketch on GitHub

Call Signature

ts
function cellColor(gray): SynthSource;

Create a synth source with cell background color defined using a grayscale value.

Parameters

ParameterTypeDescription
graySynthParameterValueGrayscale value (0-1)

Returns

SynthSource

Example

javascript
const t = textmode.create({
	width: window.innerWidth,
	height: window.innerHeight,
	plugins: [SynthPlugin],
});

t.layers.base.synth(cellColor(0.2).char(osc(6, 0.1, 1.2)));

t.windowResized(() => {
	t.resizeCanvas(window.innerWidth, window.innerHeight);
});
codex avatar
@codex{ai-generated}Replace it with your own sketch, claim the credit, and climb the leaderboard.View sketch on GitHub