Design e cores

Gerador de cantos CSS

Gerador de cantos CSS — Escolha tamanhos ou cores e confira o código ou resultado. Os dados da ferramenta ficam no seu dispositivo. Sem cadastro.

Sem cadastro

Carregando ferramenta…
Continuar em um espaço de trabalho

Como usar

  1. 1Digite os valores e escolha as opções.
  2. 2Execute a ferramenta e confira o resultado.
  3. 3Copie o resultado ou mude os dados para comparar.

Saiba mais

Confira intervalos e unidades. Os resultados dependem dos dados e do navegador.

Os anúncios podem processar dados de conexão. A personalização segue suas escolhas de privacidade. Privacidade (inglês)

Exemplo calculado de entrada e saída

Resultados do motor real com os valores abaixo, sem dados pessoais ou trabalhos salvos. Carregue o exemplo na ferramenta para conferir as mesmas entradas.

Entrada de exemplo

CampoValor
Em cima à esquerda
24
Superior direito (px)
8
Embaixo à direita
24
Inferior esquerdo (px)
8

Resultado de exemplo

border-radius: 24px 8px 24px 8px;
Condições de entrada

São limites reais de validação, sem garantir que todo valor aceito seja realista ou adequado ao seu caso.

  • Em cima à esquerda: Faixa aceita: 0 ≤ x ≤ 1.000
  • Superior direito (px): Faixa aceita: 0 ≤ x ≤ 1.000
  • Embaixo à direita: Faixa aceita: 0 ≤ x ≤ 1.000
  • Inferior esquerdo (px): Faixa aceita: 0 ≤ x ≤ 1.000

Ferramentas relacionadas

Todas as ferramentas