color_display.md

weight	draft
3	false

colorDisplay

Static method for drawing cells that are filled with colors.

Used by [drawQuadrille]({{< ref "draw_quadrille" >}}) and sample.

Example

{{< p5-global-iframe lib1="https://cdn.jsdelivr.net/gh/objetos/p5.quadrille.js/p5.quadrille.js" width="190" height="225" >}} use strict; let color;

function setup() { createCanvas(165, 165); color = createColorPicker('magenta'); }

function draw() { background('blue'); Quadrille.colorDisplay({graphics: this, value: color.value(), cellLength: width}); } {{< /p5-global-iframe >}}

{{< details title="code" open=false >}}

let color;

function setup() {
  createCanvas(165, 165);
  color = createColorPicker('magenta');
}

function draw() {
  background('blue');
  Quadrille.colorDisplay({graphics: this, value: color.value(), cellLength: width});
}

{{< /details >}}

Syntax

Quadrille.colorDisplay({graphics, value, [cellLength]})

Parameters

parameter	description
graphics	p5.Graphics: renderer target
value	p5.Color: cell contents
cellLength	Number: edge length in pixels default is [Quadrille.cellLength]({{< ref "cell_length" >}})