Guias
Como fazer o trabalho, e o que medimos ao construir a ferramenta que o faz.
Cor
Como converter HEX para RGB, HSL e OKLCH, e qual colar em cada lugar
Qual notação de cor colar onde: HEX no CSS, HEX sem # no Figma, RGB para transparência, OKLCH para tokens, e por que o CMYK é só um ponto de partida.
Como criar uma escala de cores personalizada no Tailwind que passe no contraste
Crie uma escala de onze passos no Tailwind, exporte em @theme (v4) ou config (v3) e veja quais passam no contraste sobre branco, preto e componentes.
Como extrair uma paleta de cores de uma foto e verificar se ela serve para texto
Extraia uma paleta de uma foto sem upload: o que Dominant, Distinct e Accessible calculam e por que cores de foto tendem a falhar como texto no branco.
Como transformar uma cor da marca em design tokens, de 50 a 950
De um hex da marca a uma escala de onze tons e tokens de função: qual tom vira texto, borda e fundo, por que seu hex não está nela e o que exportar.
Cores complementares, triádicas e análogas: como deixar cada harmonia legível
Complementar é 180°, triádica 120°, análoga ±30°. São relações de matiz e nenhuma garante contraste. Como montar cada uma com texto legível.
Como gerar uma paleta de cores com contraste de verdade para texto
O contraste de uma cor no branco vezes o contraste no preto dá sempre 21, então toda cor passa num deles. Como gerar uma paleta que combina consigo mesma.
Como criar uma paleta acessível a partir de uma única cor da marca
Transforme um hex da marca em um sistema completo: escala de luminosidade, tokens semânticos e variantes clara e escura aprovadas no contraste.
Como criar uma paleta de cores segura para daltônicos
Quais pares de cores resistem ao daltonismo, quais se confundem e como montar uma paleta categórica que funcione para todo mundo.
Contraste no modo escuro: por que o WCAG 2 engana você
A fórmula do WCAG 2 soma uma constante fixa de reflexo que domina no lado escuro; pares do modo escuro podem passar na razão e ainda parecer apagados.
As cores de status do Bootstrap e do Tailwind falham para pessoas daltônicas
Medimos o vermelho e o verde padrão de status do Bootstrap e do Tailwind sob daltonismo simulado. Nos dois, as cores ficam quase idênticas.
Como corrigir o contraste de cores sem mudar a cor da marca
O contraste depende da luminosidade, não do matiz. Mova a cor da marca no próprio eixo de luminosidade e ela continua sendo a sua marca e passa no WCAG.
OKLCH para designers: por que ele substituiu o HSL
A luminosidade do HSL engana. O OKLCH é perceptualmente uniforme, então passos iguais parecem iguais; é o espaço certo para escalas de cor e contraste.
Por que 83.9% dos sites falham no contraste de cores
A WebAIM achou falhas de contraste em 83.9% do milhão de home pages mais visitadas, ante 79.1%. Todo designer tem verificador; por que piora?
Por que texto corrido de 14px nunca passa no APCA
Para o APCA, 14px em peso regular é inutilizável com qualquer contraste, até preto puro sobre branco. Veja o raciocínio e o que fazer.
Qual taxa de contraste você realmente precisa?
Um guia prático de 4.5:1, 3:1 e 7:1: qual vale onde, o que conta como texto grande e as regras que as pessoas mais erram.
Verificação de contraste no CI: faça o build falhar
A revisão manual de contraste não escala e é pulada com prazo apertado. Veja como validar seus design tokens numa suíte de testes.
WCAG 2 ou APCA: qual padrão de contraste usar em 2026?
A WCAG 2 é a referência legal. O APCA prevê melhor a legibilidade. Veja como diferem, onde discordam e por qual se guiar ao publicar.
Tipografia
Como criar uma escala tipográfica fluida com clamp() no CSS
A conta do clamp() para uma escala tipográfica fluida, passo a passo de 16px a 19px, e o que o clamp() não verifica: cap-height e caracteres por linha.
Por que 16px não é 16px: a altura-x de 872 famílias de fontes
Altura-x em 872 famílias: 0.351 a 0.84 em, mediana 0.500; 19% ficam mais de 10% abaixo da referência APCA. Igualar Helvetica 16px exige 14.6 a 20.3 px.
Marca
Como fazer um guia de marca de uma página, com os pares de cores que passam no contraste
O que um guia de marca de uma página precisa e como montar a matriz de combinações: quatro cores dão 12 pares, cada um AA, só texto grande ou reprovado.
Tamanhos de favicon: de quais arquivos você realmente precisa e como criá-los
Os arquivos de favicon de que você precisa: um ICO, seis PNGs de 16 a 512 pixels, um manifest, quatro tags no head e o teste da sua marca em 16px.
Quanto de um QR code um logo pode cobrir? Nós medimos
Todo gerador diz 30%. Cerca de 5 000 tentativas de leitura põem o limite real do logo em 4% no nível L e 19% no H. Os dados, e por que 30% está errado.
Escrita
Como colocar marca d'água em PDF, e o que ela pode ou não impedir
Aplique RASCUNHO ou um nome em todas as páginas de um PDF no navegador, com opacidade e ângulo certos, e por que uma marca d'água não tranca o arquivo.
Como colocar senha em um PDF sem fazer upload
Criptografe um PDF com AES-256 no navegador, sem a senha chegar a um servidor. Senhas de usuário e de proprietário, RC4 e as opções qpdf e Preview.
Como converter PDF em JPG na resolução certa
PDF para JPG em 72, 150 ou 300 dpi: o tamanho de uma página A4 em pixels (2480 × 3508 a 300) e por que 300 tem quatro vezes os pixels de 150.
Como converter PDF para Markdown para usar em notas ou num chat de IA
Transforme um PDF em Markdown com um título por página, para notas ou chat de IA, e saiba o que ele não carrega: tabelas, listas e títulos internos.
Como dividir um PDF em vários arquivos ou separar um intervalo de páginas
Separe as páginas 3 a 7 num arquivo, corte o documento em partes iguais ou salve cada página à parte, tudo no navegador, com os limites explicados.
Como extrair texto de um PDF, e por que alguns PDFs não devolvem nada
Extraia o texto de um PDF no navegador e entenda por que um escaneado não devolve nada: não tem camada de texto e a ferramenta não faz OCR.
Como girar um PDF e salvar com as páginas na posição certa
Gire as páginas deitadas de um PDF e salve a rotação no arquivo, não só na tela. Como a rotação é gravada, por que dá errado, Preview e qpdf.
Como juntar fotos ou documentos escaneados em um único PDF
Junte fotos JPEG ou PNG num só PDF sem enviá-las: defina a ordem das páginas, escolha A4 ou ajuste à imagem e evite páginas deitadas ou enormes.
Como numerar as páginas de um PDF começando de qualquer página
Numere as páginas de um PDF no navegador, deixe a capa sem número e comece de qualquer número, com página inicial e primeiro número definidos à parte.
Como recortar as margens de um PDF, e por que o recorte esconde em vez de apagar
Recorte as margens de um PDF em pontos, no navegador. O recorte move a CropBox e deixa a MediaBox e o conteúdo no lugar, então não serve para tarjar.
Como reorganizar e excluir páginas de um PDF
Reordene páginas de PDF arrastando e exclua com um clique, a partir de miniaturas geradas no navegador, e confira a nova numeração antes de salvar.
Como tirar a senha de um PDF que você já consegue abrir
Tire a senha de um PDF que você já abre, no navegador. Por que a ferramenta pede a senha, o que a cópia mantém e as opções com Preview e qpdf.
Como ver e remover o nome do autor e outros metadados de um PDF
Veja e apague o título, o autor e o assunto de um PDF sem enviá-lo, e saiba o que fica: palavras-chave, criador, datas e o pacote XMP.
Quanto a compressão de PDF sem perda realmente economiza, medido em onze arquivos
Compressão de PDF sem perda em onze arquivos: texto caiu de 0.8% a 6.5%, imagens menos de 0.05%, e páginas excluídas ficavam no arquivo até corrigirmos.
Por que juntar um PDF criptografado pode deixar páginas em branco: nós medimos
Um PDF AES-256 juntado pelo pdf-lib original e pelo @cantoo/pdf-lib: um gerou três páginas em branco e 49 caracteres; o outro, o documento inteiro.
Vídeo e áudio
Como extrair o áudio de um vídeo em MP3 sem fazer upload
Extraia o áudio de um MP4, MOV, WebM ou MKV em MP3 no navegador. Por que arquivos acima de 13 minutos são recusados, qual bitrate usar e o ffmpeg.
Cortar vídeo sem recodificar: onde o corte cai de verdade
Seis arquivos: o corte por cópia começa em média 4.06 s antes no padrão do x264 e 0.46 s com quadro-chave a cada 1 s; a lista de edição oculta o resto.
Vídeo para GIF: quantos bytes por pixel por quadro, medido
50 quadros em 480 × 270: uma foto em movimento custa 0.644 bytes por pixel por quadro em GIF, 53 vezes o H.264; uma gravação de tela, 0.111, 5.4 vezes.
Conversores
Como aumentar uma imagem sem deixá-la borrada, e o que a ampliação não consegue fazer
Amplie com Lanczos3, compare com o redimensionador do navegador na sua própria imagem e pare em 4×: a 2×, três de cada quatro pixels são interpolados.
Como comprimir PNG sem perder qualidade
O oxipng mantém cada pixel idêntico e ainda reduziu um gráfico chapado de 21 493 para 3 350 bytes e uma foto em 14%. Até onde vai o sem perdas.
Como converter imagem para base64 (data URI), e quando não fazer isso
Base64 aumenta qualquer arquivo em um terço e a cópia embutida não tem cache próprio. Como gerar um data URI e por que parar nos 4 KB.
Como fazer um GIF animado com imagens e manter o arquivo leve
Um GIF guarda cada quadro inteiro, então o tamanho é pixels × quadros × um custo definido pela imagem. Monte o seu e veja o peso antes de exportar.
Como recortar, girar e redimensionar uma imagem de uma vez sem perder nitidez
Recorte, gire, redimensione e codifique uma vez. Por que várias ferramentas recodificam, reduções grandes borram e o que o Lanczos3 faz diferente.
Por que os conversores de pixels para polegadas discordam, e qual resposta é a sua
Os mesmos 1920 pixels são 20 polegadas em CSS, 26.67 a 72 ppi e 6.4 a 300 ppi. Por que os conversores divergem e como escolher o sentido certo.
Como reduzir o tamanho de um SVG sem quebrar o arquivo
Reduza um SVG com o SVGO sem quebrá-lo: corte a precisão das coordenadas, mantenha o viewBox e o title, confira os ids e julgue pelo tamanho com gzip.
Quanto se economiza convertendo PNG para WebP, medido em onze imagens
PNG para WebP com qualidade 0.82 no Chromium: fotos encolheram de 92% a 97%, um logo chapado 69%, e ícones abaixo de 128 px cresceram, até 116% em 16 px.