Skip to content
pixi-silk
GitHub repository
Function

mesh

import { mesh } from 'pixi-silk';
function mesh(
   cols: number, 
   rows: number, 
   colors: MeshColorInput[], 
   options?: MeshGradientOptions
): MeshGradient;

Gradient mesh: cols by rows control colours (row by row, top-left first) spread over the painted shape’s box, blended into one smooth surface. cols and rows are clamped to 1..16. Missing colours repeat the last one.

Parameters#

ParameterType
colsnumber
rowsnumber
colorsMeshColorInput[]
optionsMeshGradientOptions

Returns#

MeshGradient

Example#

// a light beam that fades at the sides and towards the top
const beam = mesh(3, 3, [
    [0xffd6e8, 0], [0xffd6e8, 0], [0xffd6e8, 0],
    [0xffd6e8, 0.2], [0xffd6e8, 0.5], [0xffd6e8, 0.2],
    [0xffe6f0, 0.6], [0xffffff, 1], [0xffe6f0, 0.6],
]);
g.rect(0, 0, 200, 240).fill(beam);