UTILS.
Privés par défaut
▲

Générateur de triangle CSS

Générez un triangle en pur CSS dans n'importe quelle direction et copiez le CSS.

Vos fichiers restent sur cet appareil

Les fichiers sont traités dans votre navigateur, jamais envoyés. Le site télécharge le code et les ressources nécessaires aux outils. Sans compte ni traceurs.

Utilisez Télécharger pour enregistrer cet outil dans un fichier HTML utilisable hors ligne.

Confidentialité →

À propos de cet outil

Produisez un triangle en pur CSS grâce à l'astuce classique des bordures — choisissez une direction, une taille et une couleur, puis copiez la règle. L'aperçu se met à jour en direct et tout fonctionne dans votre navigateur.

Foire aux questions

Comment fonctionne l'astuce des bordures ?
Un élément de largeur et de hauteur nulles n'affiche que ses bordures ; en rendant trois bordures transparentes, il ne reste qu'une bordure colorée en forme de triangle.
Pourquoi la largeur et la hauteur sont-elles à 0 ?
Sans surface de boîte, les bordures se rejoignent au centre, de sorte que la seule bordure visible devient un triangle net plutôt qu'un bord épais.

Plus d'outils