# Shader Dither

Uma imagem pixelada em poucos tons da rampa da marca, com o dither de Bayer fazendo a passagem entre um tom e outro.

- Nome no registry: `shader-dither`
- Tipo: componente
- Dependências npm: nenhuma
- Demo: https://ui.visantlabs.com/c/shader-dither
- Categorias: shaders, shader, webgl, imagem, dither, 8-bits, pixel

## Quando usar

- Use quando: Foto com cara de jogo de 8 bits em poucos tons da marca, em landing de game, evento ou campanha retrô
- Evite quando: Só papel e tinta: shader-matrix-dither; blocos de cor sem trama, shader-pixelate

## Instalar

```bash
npx shadcn@latest add @visant/shader-dither
```

## Usar

```tsx
<ShaderDither />
```

## API

### ShaderDither

- `src: string` — A imagem a pontilhar. Fundo branco ou transparente vira papel.
- `alt?: string = "Imagem pontilhada em poucos tons"` — Texto alternativo da imagem.
- `colors?: string[]` — Rampa de duas a quatro paradas, do papel à tinta mais funda. Qualquer cor CSS ou token.
- `contrast?: number = 50` — Contraste antes de reduzir os tons.
- `levels?: number = 4` — Quantos tons a imagem usa, espalhados pela rampa.
- `offset?: number = 0` — Desvio: positivo escurece a imagem (mais tinta), negativo clareia.
- `size?: number = 4` — Tamanho do pixel da imagem e do ponto da trama, em px.
