Regra dos terços: linhas e pontos em pixels

Você pode usar o resultado para posicionar guias de composição em um editor, uma interface de câmera, uma ferramenta de corte, um sistema de design ou um fluxo automatizado. Quando uma dimensão não é divisível por três, as frações são mantidas para que o ambiente de desenho escolha a forma adequada de renderização.

O que representam as coordenadas da regra dos terços

Uma sobreposição da regra dos terços divide uma imagem retangular em três colunas e três linhas iguais. A calculadora posiciona as guias verticais em um terço e dois terços da largura informada, e as horizontais em um terço e dois terços da altura. Os cruzamentos formam quatro pontos de referência usados com frequência para posicionar uma pessoa, um rosto, um detalhe do horizonte ou outro elemento visual importante. As coordenadas começam no canto superior esquerdo: x cresce para a direita e y cresce para baixo. Essa convenção é comum em gráficos rasterizados, canvas, navegadores e editores de imagem. A resposta mantém a largura e a altura originais e separa as linhas verticais, horizontais e interseções para facilitar o uso de cada grupo. O recurso não examina pixels, não avalia a composição, não corta a imagem nem move nenhum objeto. Ele fornece geometria determinística que outro aplicativo pode desenhar, armazenar, comparar ou usar como orientação de enquadramento.

Como pixels fracionários e validação são tratados

Cada coordenada é calculada diretamente a partir da dimensão total, sem arredondamento intermediário. Para uma largura de 1200 pixels, as guias verticais ficam exatamente nos valores x 400 e 800. Para 1000 pixels, ficam em 333.3333333333333 e 666.6666666666666 na representação numérica do JavaScript. Manter essas frações é importante porque os sistemas de renderização são diferentes: um canvas vetorial pode desenhar em posições de subpixel, enquanto um fluxo rasterizado pode preferir arredondar para baixo, para cima, para o inteiro mais próximo ou conforme o dispositivo. Uma regra arbitrária dentro da calculadora eliminaria essa escolha e poderia deixar uma região externa maior que a outra. A largura e a altura precisam ser números inteiros, positivos e finitos, pois descrevem dimensões rasterizadas. O valor zero é rejeitado expressamente porque uma imagem sem largura ou altura não possui área geométrica útil. Valores negativos, frações, campos ausentes, textos, infinitos e dados não numéricos também geram um erro de entrada inválida.

Como usar o resultado em editores e automações

Para desenhar a sobreposição, trace cada guia vertical de y igual a zero até a altura total na coordenada x retornada. Depois, trace cada guia horizontal de x igual a zero até a largura total na coordenada y correspondente. Os quatro pontos de interseção já vêm enumerados e podem virar alças, alvos, marcadores ou referências de encaixe sem novo cálculo. Em uma visualização responsiva, use as dimensões reais da imagem em pixels, e não o tamanho CSS exibido; em seguida, aplique às coordenadas o mesmo fator de escala da imagem. Em um fluxo de corte, faça o cálculo sobre o retângulo final depois de conhecer suas dimensões, pois os terços pertencem ao enquadramento definitivo. A função é pura e não usa rede, aleatoriedade, datas, decodificação de imagem nem estado persistente. Portanto, entradas idênticas sempre produzem o mesmo JSON, o que atende ferramentas web, validações no servidor, testes e processos reproduzíveis. O uso no navegador é grátis; uma solicitação API custa US$ 0,002.