the IT Hustle
FerramentasManual de campoSobre

Empresa

  • Sobre
  • Manual de campo
  • Glossário de IA
  • O autor
  • Contato

Produto

  • Ferramentas
  • Monitor de preços
  • Agent Ops
  • Código
  • Design
  • Administração
  • Produtividade
  • Marketing
  • Negócios

Jurídico

  • Política de privacidade
  • Termos de serviço
  • Aviso legal
  • Política editorial
  • Correções

© 2026 Salty Rantz LLC. Todos os direitos reservados.

Feito para profissionais navegando a transformação tecnológica.

Gerador de Border Radius

Editor visual de border-radius. Arraste cantos ou digite valores. Predefinições: pílula, círculo, blob. Saída CSS.

Gerador de Border Radius

Visually design border-radius values for every corner. Drag sliders, use presets, or type exact values. Copy CSS instantly.

Predefinições
Top Left
Top Right
Bottom Right
Bottom Left
Configurações da caixa
Valores dos cantos
Top Left12px
Top Right12px
Bottom Right12px
Bottom Left12px
CSS abreviado
border-radius: 12px;
Propriedades individuais
border-top-left-radius: 12px;
border-top-right-radius: 12px;
border-bottom-right-radius: 12px;
border-bottom-left-radius: 12px;

Como projetar formas com border radius

Crie cantos arredondados, pílulas e formas orgânicas de blob com o gerador gratuito de Border Radius do The IT Hustle.

  1. 1
    Comece com um presetExperimente Arredondado, Pílula, Círculo, Blob, Ticket, Gota, Folha ou Mensagem para carregar uma forma instantaneamente, depois ajuste os detalhes.
  2. 2
    Ajuste cada cantoArraste o controle deslizante ou digite um valor para cada canto (superior-esquerdo, superior-direito, inferior-direito, inferior-esquerdo), ou marque 'Vincular todos' para alterar os quatro juntos.
  3. 3
    Escolha sua unidadeAlterne entre px para arredondamento fixo e % para arredondamento que escala com o tamanho do elemento.
  4. 4
    Visualize em diferentes tamanhosRedimensione a caixa de prévia e mude sua cor para ver como a forma fica em um elemento parecido com o seu.
  5. 5
    Copie o CSSCopie o atalho border-radius, ou pegue as propriedades individuais de cada canto se sua folha de estilos precisar delas separadamente.

Perguntas frequentes

Use px quando quiser um arredondamento consistente independentemente do tamanho do elemento — como 8px em todos os cartões. Use % quando o arredondamento deve escalar com o elemento; 50% em um elemento quadrado produz um círculo perfeito.

Defina largura e altura iguais do elemento, depois aplique border-radius: 50%. O preset Círculo faz exatamente isso — só parece circular quando o elemento é quadrado.

border-radius: a b c d aplica os valores no sentido horário a partir do superior-esquerdo: superior-esquerdo, superior-direito, inferior-direito, inferior-esquerdo. A ferramenta também exibe cada canto como uma propriedade individual, se você preferir regras explícitas.

Os blobs usam valores assimétricos em cada canto, para que nenhum canto seja igual a outro, produzindo uma forma orgânica. Gere variações ajustando levemente os valores de cada canto enquanto observa a prévia ao vivo.

Ferramentas relacionadas

Gerador de Box ShadowGerador de Gradiente CSSEditor de Filtros CSS