Softonic

Cantinhos Arredondados da Imagem

Etapa 1 / 3 Raio dos cantos

Sistemas operacionais, lojas de aplicativos e sistemas de design de UI gostam de cantos arredondados, ícones do iOS, cartões Material, componentes modernos do Tailwind. Faça o upload de qualquer imagem e esta ferramenta arredonda os quatro cantos para o raio que você definir, exporta como PNG com cantos transparentes e, opcionalmente, aplica um raio diferente por canto para aparências de bilhete ou balão de fala.

Como arredondar os cantos da imagem

  1. 1

    Faça upload de uma imagem

    JPG, PNG ou WebP.

  2. 2

    Escolha um raio

    Em pixels ou como uma porcentagem do lado mais curto.

  3. 3

    Opcional: diferente por canto

    Arredonde apenas os cantos superiores (cartão), ou assimétrico (bilhete).

  4. 4

    Escolha o fundo

    Transparente (PNG) ou uma cor sólida se salvar como JPG.

  5. 5

    Exportar

    PNG preserva o alfa arredondado; JPG achata para a cor que você escolheu.

Escolhas de raio para formas comuns de UI

Predefinições de raio

Forma Raio
Cartão de UI sutil 4-8 px
Cartão Material Design 4 px (ou 8 px no M3)
Ícone de aplicativo iOS 22,37% do lado (o “squircle”)
Ícone de aplicativo macOS 18,75% do lado
Bolha de história do Instagram 12-16 px
Avatar arredondado 50% do lado curto (totalmente circular)
Bilhete Assimétrico, arredonde apenas um ou dois cantos
Lado da cauda da bolha de chat Um canto pequeno, o resto maior

O problema do squircle

Ícones do iOS não são simples retângulos arredondados, eles usam um “superelipse” que é matematicamente mais suave na transição. Verdadeiros squircles estão além do que um border-radius CSS ou uma máscara alfa simples podem renderizar; a ferramenta os aproxima com um retângulo arredondado de alta ordem que parece indistinguível em tamanhos típicos de ícones.

Comportamento de transparência

  • Saída PNG é o padrão, os cantos arredondados se tornam pixels transparentes. Útil para ícones de aplicativos, cartões de UI e em qualquer lugar que você precise compor a imagem em um fundo variado.
  • Saída JPG não pode ser transparente. Os cantos arredondados se preenchem com uma cor que você escolher, fazendo a foto parecer emoldurada.

Raio diferente por canto

Uma aparência de bolha de chat: arredonde três cantos a 12 px e deixe um a 0 px (o canto onde a “cauda” se anexaria). Um bilhete: dois cantos afiados e dois arredondados. Raios assimétricos são uma maneira rápida de sugerir que a imagem se conecta a algo mais.

Anti-aliasing

As curvas dos cantos são desenhadas com super-amostragem 4x para que pareçam nítidas em tamanhos normais de visualização. Impressas ou muito ampliadas, o raio ainda é visivelmente suave.

Perguntas frequentes

A Apple usa um squircle cuja curvatura de canto é aproximadamente 22,37% do lado do ícone. Em uma tela de 1024 × 1024, isso é cerca de 229 px de raio de canto efetivo, embora a matemática exata difira ligeiramente de um retângulo arredondado simples.

Sim. O raio é aplicado por canto, independentemente da proporção da imagem. Em proporções extremas (muito largas ou muito altas), definir o raio para 50% do lado curto produz uma forma de cápsula.

Não, JPG não suporta transparência. Ou exporte como PNG para manter o alfa arredondado, ou escolha uma cor de fundo para o JPG e os cantos se preencherão com essa cor.

Sim. A ferramenta apenas adiciona uma máscara alfa e não redimensiona a imagem. Se você quiser combinar arredondamento com redimensionamento, aplique o redimensionador primeiro.

Ferramentas relacionadas

Seletor de Cores do Material Design

Navegue pela paleta de cores do Material Design. Copie qualquer tonalidade (50 a A700) como HEX, RGB ou HSL com um toque.

Criador de gráficos de ponto cruz

Transforme JPEG, PNG ou WebP em gráfico de ponto cruz imprimível com 10–150 pontos, 2–40 cores próprias, símbolos, contagens exatas e medidas do tecido.

Criador de Crachás

Crie até 60 crachás imprimíveis a partir de uma lista Nome | segunda linha. Escolha 8 cartões ou 15 etiquetas por página em A4 ou US Letter e imprima localmente.

Criador de jornal

Crie uma capa de jornal com suas próprias manchetes e matérias, depois copie ou baixe o texto simples ou use a caixa de impressão do navegador.

Conversor de ARW para JPG

Converta fotos RAW ARW da Sony para JPG. Obtenha um JPEG compartilhável e universalmente compatível a partir do arquivo RAW da câmera sem abrir o Lightroom.

Leitor de QR Code

Decodifique um QR Code de uma imagem PNG, JPG ou WebP no navegador. Veja URL, Wi-Fi, vCard, SMS, e-mail, calendário, geo ou texto antes de usar.

Ferramenta disponível em outros idiomas