Gerador de setas CSS

Próximo

Crie uma seta CSS simples. Escolha direita, esquerda, cima ou baixo, além de cor, tamanho quadrado e espessura da borda. Depois copie a regra .arrow gerada.

Crie uma seta CSS

  1. 1

    Escolha uma direção

    Selecione direita, esquerda, cima ou baixo.

  2. 2

    Defina a aparência

    Escolha cor, tamanho e espessura em pixels.

  3. 3

    Copie o CSS

    Confira a prévia e copie a regra.

O gerador cria um elemento .arrow quadrado com display: inline-block, largura e altura iguais, borda direita e inferior e uma rotação para as quatro direções.

Ele não cria triângulos de borda, clip-path, SVG, gradientes, setas diagonais ou caudas de tooltip. Também não fornece HTML, validação de layout ou orientação de compatibilidade. Teste a regra copiada na sua página.

Ferramentas relacionadas