Usa bordes transparentes en un elemento de tamaño cero, coloreando solo un lado.

¿Puedo usarlo para flechas?

Sí, los triángulos CSS son habituales para tooltips y flechas de menús desplegables.

Generador de triángulos CSS

Genera triángulos CSS con el truco de los bordes.

DirecciónAncho: 80pxAlto: 60pxColor

width: 0;
height: 0;
border-left: 40px solid transparent;
border-right: 40px solid transparent;
border-bottom: 60px solid #6366f1;

Crea un triángulo con CSS puro en cualquier dirección, tamaño y color, y copia el código del borde.

¿Cómo funciona?: Usa bordes transparentes en un elemento de tamaño cero, coloreando solo un lado.
¿Puedo usarlo para flechas?: Sí, los triángulos CSS son habituales para tooltips y flechas de menús desplegables.