---
url: /api/effects/dither/functions/ditherBayer.md
---
# ditherBayer()

```ts
function ditherBayer(
  params?: {
    size?: number;
    color?: boolean;
    levels?: number;
  } & {
    matrix?: 4 | 2 | 8;
  },
): EffectPass<
  {
    uTexture: (
      __namedParameters: Readonly<EffectUniformContext>,
    ) => WebGLTexture;
    uResolution: (
      __namedParameters: Readonly<EffectUniformContext>,
    ) => [number, number];
    uDpr: (__namedParameters: Readonly<EffectUniformContext>) => number;
    uSize: number;
    uColor: boolean;
    uLevels: number;
  } & {
    uMatrix: 2 | 4 | 8;
  }
>;
```

Creates a Bayer ordered dithering post-processing effect.

Each pixel is thresholded against a repeating Bayer matrix, which produces
the classic cross-hatch pattern.

## Parameters

### params?

{
`size?`: `number`;
`color?`: `boolean`;
`levels?`: `number`;
} & {
`matrix?`: `4` | `2` | `8`;
}

Dither configuration.

## Returns

[`EffectPass`](../../../passes/effectPass/type-aliases/EffectPass.md)<{
`uTexture`: (`__namedParameters`: `Readonly`<[`EffectUniformContext`](../../../passes/effectPass/type-aliases/EffectUniformContext.md)>) => `WebGLTexture`;
`uResolution`: (`__namedParameters`: `Readonly`<[`EffectUniformContext`](../../../passes/effectPass/type-aliases/EffectUniformContext.md)>) => \[`number`, `number`];
`uDpr`: (`__namedParameters`: `Readonly`<[`EffectUniformContext`](../../../passes/effectPass/type-aliases/EffectUniformContext.md)>) => `number`;
`uSize`: `number`;
`uColor`: `boolean`;
`uLevels`: `number`;
} & {
`uMatrix`: `2` | `4` | `8`;
}>

## Remarks

Expects linear input and writes sRGB-encoded output, so use it as the last
effect, after a tone mapping with `outputColorSpace: "linear"`. The pattern
is mixed in linear light between the two nearest palette levels, so the
average light matches the source.