ForHosting KIT · Imagens

Gerar BlurHash

Gere o BlurHash de qualquer imagem: uma sequência curta de caracteres que, decodificada na tela, vira uma prévia borrada da foto real enquanto ela carrega. É o placeholder que os apps modernos usam no lugar do quadrado cinza. Grátis, no navegador, sem enviar o arquivo.

● EstávelGrátis · no seu navegador

Executar grátis Ver a API

Use pelo WebAPIE-mailApp em breveTelegram em breve

O que é um BlurHash

BlurHash é uma representação compacta de uma imagem: cerca de vinte ou trinta caracteres que codificam as cores e a distribuição de luz da foto. Guardado no banco junto com o registro da imagem, ele viaja na primeira resposta da sua página ou app — antes de qualquer arquivo de imagem — e o cliente o decodifica localmente num borrão fiel ao conteúdo real. Quando a foto termina de carregar, entra por cima do borrão, numa transição natural.

Por que não deixar o quadrado cinza

Numa conexão de celular no ônibus, cada imagem leva seu tempo. Se o espaço fica cinza ou branco, a página parece quebrada; se aparece um borrão com as cores certas da foto, parece que está quase pronta. Além da percepção de velocidade, o placeholder com as dimensões corretas evita o pulo de layout — aquele deslocamento irritante do conteúdo quando a imagem finalmente chega. É polimento barato que o usuário sente sem saber nomear.

Gere aqui, grátis e sem upload

Escolha a imagem e copie a string: a codificação roda inteira no seu navegador, sem enviar o arquivo a servidor nenhum, sem cadastro e sem limite. Serve para testar a técnica, gerar os hashes de um site pequeno ou preencher o banco de um protótipo. Cole o resultado no seu banco de dados ou direto no componente que fará a decodificação no cliente.

Em produção: gere no momento do upload

Num produto vivo, o BlurHash deve nascer junto com a imagem: o usuário envia a foto, o sistema gera o hash e grava os dois. Para isso existe a chamada de API, a US$ 0,002 por chamada — custo que praticamente desaparece na conta, mesmo com milhares de uploads por mês. Pagamento por uso, sem plano; integrar leva o tempo de escrever uma requisição.

Casos de uso

Feed de marketplace no 4G

Um marketplace de artesanato carrega dezenas de fotos por rolagem. Com o BlurHash de cada produto gravado no banco, o feed aparece colorido de imediato, mesmo na rede móvel — e as fotos vão chegando por cima.

Portfólio que impressiona já no primeiro segundo

A fotógrafa Juliana Nascimento serve o portfólio com prévias borradas das próprias fotos. O visitante nunca vê tela branca: vê a composição de cores de cada imagem se revelando.

App de notícias sem pulos de layout

O app de um portal reserva o espaço exato de cada foto com o borrão decodificado do BlurHash. O leitor rola o feed sem que o texto salte quando as imagens carregam.

Perguntas frequentes

Que tamanho tem a string gerada?

Algumas dezenas de caracteres — cabe numa coluna de texto comum do banco de dados, sem custo relevante de armazenamento.

O BlurHash substitui a imagem de verdade?

Não: ele é só a prévia borrada. A foto real continua sendo servida normalmente; o hash cobre o intervalo até ela chegar.

Preciso de biblioteca para exibir o borrão?

Sim — a decodificação acontece no cliente, e existem implementações abertas de BlurHash para as principais linguagens e frameworks de interface.

Minha imagem é enviada quando gero o hash aqui?

Não: a codificação roda no seu navegador e o arquivo não sai do aparelho. O que você copia é apenas a string resultante.

Quanto custa gerar em lote pelo sistema?

US$ 0,002 por chamada de API, pago por uso — sem assinatura. Na página, o uso é livre e gratuito.

Funciona com qualquer proporção de imagem?

Funciona: o hash guarda a essência de cor e luz da imagem, e o componente de exibição o estica para o espaço reservado — por isso vale reservar a proporção correta no layout.

Para desenvolvedores — acesso via API

Tudo nesta página está disponível via API. Esta seção é para equipes que querem integrar a ferramenta aos próprios sistemas; quem não precisa disso pode simplesmente usar a ferramenta acima.

Endpoint

POSThttps://api.kit.forhosting.com/image/blurhash

Autenticação por token Bearer. Um único POST coloca a tarefa na fila; o resultado chega por webhook ou link assinado.

Chame do seu código

curl -X POST https://api.kit.forhosting.com/image/blurhash \
  -H "Authorization: Bearer $KIT_KEY" \
  -H "Content-Type: application/json" \
  -d &#39;{"image":"https://ejemplo.com/imagen.jpg"}'

const res = await fetch("https://api.kit.forhosting.com/image/blurhash", {
  method: "POST",
  headers: {
    "Authorization": `Bearer ${process.env.KIT_KEY}`,
    "Content-Type": "application/json"
  },
  body: JSON.stringify({
    "image": "https://ejemplo.com/imagen.jpg"
  })
});
const { task_id } = await res.json();

import os, requests

res = requests.post(
    "https://api.kit.forhosting.com/image/blurhash",
    headers={"Authorization": f"Bearer {os.environ[&#39;KIT_KEY']}"},
    json={
    "image": "https://ejemplo.com/imagen.jpg"
},
)
task_id = res.json()["task_id"]

<?php
$res = file_get_contents("https://api.kit.forhosting.com/image/blurhash", false, stream_context_create([
  "http" => [
    "method"  => "POST",
    "header"  => "Authorization: Bearer " . getenv("KIT_KEY") . "\r\nContent-Type: application/json",
    "content" => &#39;{"image":"https://ejemplo.com/imagen.jpg"}',
  ],
]));
$task = json_decode($res, true);

body := bytes.NewBufferString(`{"image":"https://ejemplo.com/imagen.jpg"}`)
req, _ := http.NewRequest("POST", "https://api.kit.forhosting.com/image/blurhash", body)
req.Header.Set("Authorization", "Bearer "+os.Getenv("KIT_KEY"))
req.Header.Set("Content-Type", "application/json")
res, _ := http.DefaultClient.Do(req)

Exemplo de requisição

{
  "image": "https://ejemplo.com/imagen.jpg"
}

Exemplo de resposta

{
  "task_id": "tsk_a1b2c3d4e5f6a1b2c3d4e5f6",
  "type": "image.blurhash",
  "status": "queued",
  "_links": {
    "result": "/tasks/tsk_…/result"
  }
}

A API é assíncrona: cada chamada devolve um task_id na hora. Se preferir polling, consulte o status a até 1 requisição por segundo.

Preço

por chamadaUS$ 0,002

Preço publicado, sem tokens nem créditos escondidos. Tarefa que falha não é cobrada.

Limites

`max_mb`	15
`max_megapixels`	12

Erros

HTTP	Código	O que significa
`401`	`unauthorized`	Token ausente ou inválido. Confira o header Authorization.
`402`	`insufficient_balance`	Saldo insuficiente para esta tarefa. Faça uma recarga e tente de novo.
`404`	`unknown_type`	Esse tipo de tarefa não existe. Confira o campo type no catálogo.
`429`	`rate_limited`	Muitas requisições em pouco tempo. Espere um instante e tente de novo.

Ver a documentação completa do KIT →

Executar grátis