HTML + CSSLoaders
Triángulo que se dibuja
El contorno de un triángulo que se dibuja solo, cambia de color en mitad del ciclo y vuelve a vaciarse.
Ajustes
72px
1x
Código
<svg class="ul-tri" viewBox="0 0 100 100"><path d="M50 12 L90 84 L10 84 Z" pathLength="100"/></svg>Prompt para IA
Pégalo en ChatGPT, Claude o Cursor y adaptará el bloque a tu proyecto con estos ajustes, aunque no uses React.
Más en Loaders
Dónde usarlo
Un triángulo puede ser una montaña, un tejado o un botón de play según el contexto, así que este loader SVG encaja en una tienda de material de montaña, la reserva de un refugio o la web de un estudio de arquitectura. La línea se dibuja, cambia de color a mitad y se borra desde donde empezó, todo con CSS.
Queda mejor en diseños limpios y minimalistas, donde esa única línea tiene espacio. Si quieres que se note más, sube el tamaño antes que la velocidad; un triángulo rápido parece más una señal de peligro que una pausa.