Gerador de border-radius CSS
Crie cantos arredondados em CSS com prévia ao vivo: ajuste cada canto, ligue os quatro juntos ou crie formas orgânicas (blob) com os 8 valores do border-radius.
Gerador de border-radius e blob
Gerador de border-radius CSS: para que serve
Ajuste os quatro cantos juntos ou separados, em px ou %, e veja a forma mudar na hora. No modo Blob, use os raios horizontais e verticais para criar formas orgânicas e gere variações aleatórias. O CSS fica pronto para copiar.
O código não é enviado para nenhum servidor: a conversão acontece no seu navegador.
Como usar
- Escolha cantos ou blob.
- Ajuste os controles deslizantes.
- Copie o CSS gerado.
Quando usar
- Criar botões e cards arredondados.
- Fazer formas orgânicas para fundos.
- Aprender a sintaxe do border-radius.
Perguntas frequentes
Como arredondar só alguns cantos?
Desligue a opção de cantos iguais e ajuste cada um. A ordem no CSS é superior esquerdo, superior direito, inferior direito e inferior esquerdo.
Como fazer uma forma orgânica (blob)?
Use o modo Blob: ele usa a sintaxe com barra, como 30% 70% 70% 30% / 30% 30% 70% 70%, em que os valores antes da barra são os raios horizontais e os depois, os verticais.
É grátis mesmo?
Sim, 100% grátis. Sem cadastro, sem assinatura e sem limite de uso. Todas as ferramentas do Ferramentas123 são gratuitas e rodam direto no seu navegador.