ifBuyz Tools
Conception

Générateur de triangle CSS

Entrée

Choisissez la direction, la base, la hauteur et la couleur.

Direction
Base Width60px
Hauteur80px

Copiez le CSS généré et appliquez-le à un élément vide.

Sortie

.triangle {
  width: 0;
  height: 0;
  border-left: 60px solid transparent;
  border-right: 60px solid transparent;
  border-bottom: 80px solid #6366f1;
}

Questions fréquentes

Comment créer un triangle en CSS ?
Avec des bordures où une seule face est colorée.
Peut-on changer la direction ?
Oui, en ajustant la bordure visible.
Pourquoi cet outil est utile ?
Il calcule rapidement la syntaxe correcte.