6XC

Gerador de Border Radius CSS

Arredonde cada canto individualmente ou todos de uma vez, em px ou %, com pré-visualização ao vivo e CSS copiável.

971 visualizações

Unidade

A propriedade border-radius

A ordem abreviada é border-radius: superior-esquerdo superior-direito inferior-direito inferior-esquerdo. Pixels dão um arredondamento fixo; porcentagens escalam com a caixa — 50% em um quadrado cria um círculo perfeito. Valores desiguais criam formas orgânicas de "blob", populares em seções hero modernas.

Perguntas Frequentes

Como faço um círculo ou uma pílula?

Um elemento quadrado com border-radius: 50% vira um círculo. Um retângulo com um raio fixo grande (por exemplo, 999px) vira uma pílula.

px ou % — qual devo usar?

Use px quando os cantos precisarem parecer idênticos em todos os tamanhos (cards, botões). Use % quando o arredondamento precisar escalar com o elemento, como em círculos e blobs.

Ferramentas Semelhantes

Gerador de Gradiente CSS Crie gradientes CSS lineares, radiais e cônicos com pré-visualização ao vivo e copie o código. Gerar Gerador de Sombra CSS (Box Shadow) Desenhe uma box-shadow visualmente — deslocamentos, desfoque, expansão, cor, opacidade e inset — com pré-visualização em tempo real. Gerar Gerador de Sombra de Texto CSS Crie um text-shadow com deslocamentos, desfoque, cor e opacidade — pré-visualização ao vivo em texto de exemplo. Gerar Gerador de Borda CSS Desenhe uma borda visualmente — espessura, estilo (solid, dashed, dotted, double…), cor e raio — com pré-visualização em tempo real. Gerar