UTILS.
Privadas por padrão
▲

Gerador de Triângulo CSS

Gere um triângulo em CSS puro em qualquer direção e copie o CSS.

Seus arquivos ficam neste dispositivo

Os arquivos são processados no navegador, nunca enviados. O site baixa o código e os recursos necessários. Sem contas ou rastreadores.

Use Baixar para salvar esta ferramenta em um único arquivo HTML para uso offline.

Privacidade →

Sobre esta ferramenta

Produza um triângulo em CSS puro usando o clássico truque das bordas — escolha uma direção, tamanho e cor, e depois copie a regra. A pré-visualização é atualizada ao vivo e tudo roda no seu navegador.

Perguntas frequentes

Como funciona o truque das bordas?
Um elemento com largura e altura zero mostra apenas suas bordas; tornando três bordas transparentes, sobra uma borda colorida em formato de triângulo.
Por que a largura e a altura são definidas como 0?
Sem área de caixa, as bordas se encontram no centro, então a única borda visível se torna um triângulo limpo em vez de uma aresta espessa.

Mais ferramentas