ToolAtlasO card do e-mail precisa de foto com canto macio e o Outlook no Windows desenha quadrado. Esta aba pinta o bitmap. Sombra CSS é outra página.
O HTML da newsletter levou border-radius e, no Outlook do escritório, a foto do produto voltou quadrada. Can I Email e guias de e-mail repetem: o Outlook no Windows ignora o raio; o Gmail web até honra. WhatsApp, PowerPoint e o card colado no Slack também não aplicam o CSS da sua landing.
O trabalho desta página é assar o canto no bitmap nesta aba, não devolver um trecho de CSS. No site público, continue com CSS. Aqui o recorte é o arquivo que viaja sozinho.
CSS no site, PNG no arquivo
No navegador isto basta:
img.card {
border-radius: 16px;
overflow: hidden;
}No e-mail corporativo brasileiro isso some. Botão “à prova de Outlook” às vezes usa VML; foto de produto com canto macio é mais barato já recortada em PNG. O Stripo em português trata fundo e botão com imagem justamente porque o motor do Word não desenha o raio.
Raio demais em retrato estreito come orelha e logo. Comece pequeno.
Como assar o canto
- Solte JPG ou PNG (cerca de 32 MB). HEIC: converta.
- Ajuste o raio. Modo círculo na interface usa metade do lado — bom para avatar depois do corte 1:1.
- Baixe o PNG. Se o Gmail reclamar do peso, compacte.
Nada é enviado. A foto não sobe para um editor na nuvem.
O que não misturar
- Sombra e degradê: box-shadow e gradiente — CSS, não pixel.
- Favicon redondo: gerador de favicon é outro arquivo.
- Isto não é Figma, não gera VML e não conserta o motor do Outlook.
Utilitário nesta aba. Se o canto for identidade da marca no botão HTML, o time de e-mail ainda precisa do fallback VML — esta página não escreve isso.