# Shader Upscale

Uma imagem pequena ampliada em bicúbico com nitidez, e uma linha que segue o cursor mostrando o antes em blocos.

- Nome no registry: `shader-upscale`
- Tipo: componente
- Dependências npm: nenhuma
- Demo: https://ui.visantlabs.com/c/shader-upscale
- Categorias: shaders, shader, webgl, imagem, ampliacao, antes-e-depois

## Quando usar

- Use quando: Mostrar o ganho de uma ampliação lado a lado, em página de ferramenta de imagem ou de IA
- Evite quando: Comparar duas fotos diferentes: photo-compare; foto em blocos como estilo, shader-pixelate

## Instalar

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

## Usar

```tsx
<ShaderUpscale />
```

## API

### ShaderUpscale

- `src: string` — A imagem a reduzir e ampliar de volta. Fundo transparente vira papel.
- `alt?: string = "Imagem pequena ampliada"` — Texto alternativo da imagem.
- `colors?: string[]` — Paradas: papel e linha do comparador. Qualquer cor CSS ou token.
- `compare?: boolean = true` — Mostra o antes (vizinho mais próximo) à esquerda de uma linha que segue o cursor.
- `resolution?: number = 64` — Lado maior da versão pequena, em px: quanto menor, mais a ampliação trabalha.
- `sharpening?: number = 30` — Nitidez depois de ampliar.