Gerador de cantos arredondados (border-radius)
Ajuste o raio de cada canto separadamente e obtenha o código CSS border-radius com pré-visualização.
É processado no seu dispositivo. Nada é enviado para nenhum servidor.
border-radius: 24px 24px 24px 24px;Ajuste o raio de cada canto de um elemento de forma independente e obtenha o código CSS border-radius com pré-visualização em tempo real.
Gera a sintaxe abreviada de border-radius com os quatro valores na ordem superior-esquerdo, superior-direito, inferior-direito, inferior-esquerdo.
Casos de uso
- Criar um cartão com cantos assimétricos.
- Desenhar um elemento em forma de gota ou balão de chat.
- Ajustar visualmente o arredondamento de um botão.
Como funciona
- 1
Ajuste cada canto
Introduza o raio em pixels para cada um dos quatro cantos.
- 2
Copie o CSS
Copie a propriedade border-radius pronta para colar.
Perguntas frequentes
Posso definir um raio diferente para cada canto?
Sim, cada um dos quatro cantos é controlado de forma independente.
Ferramentas relacionadas
- Gerador de Box ShadowCria sombras CSS com preview ao vivo.
- Gerador de Gradientes CSSCria gradientes CSS com preview.
- Seletor de CorEscolha uma cor e obtenha HEX, RGB e HSL.
- Gerador de PaletasGera paletas harmônicas a partir de uma cor base.
- Gerador de Cores AleatóriasGera uma cor HEX aleatória.
- Verificador de Contraste WCAGVerifica o contraste WCAG entre duas cores.