Tiny Online Tools
Setas para Ponteiros e Diagramas Sem Illustrator
As setas fazem muito trabalho em UI e documentação: explicam fluxos, destacam anotações, conectam ideias em slides e guiam o usuário em uma captura de produto. Este gerador produz um <path> SVG limpo que você pode colar em qualquer lugar e estilizar com CSS.
Estilos de Seta
- Reta — linha simples do início à ponta. Perfeita para anotações rápidas e diagramas compactos.
- Curva — bezier quadrático com curvatura ajustável. Útil quando a seta precisa contornar outros elementos.
- Zigue-zague — dente-de-serra, ótimo para transmitir "rapidez" ou "energia" em designs descontraídos.
Tipos de Ponta
- Triangular — polígono preenchido, a ponta "sólida" clássica.
- Aberta — dois traços, aparência desenhada à mão.
- Dupla — duas pontas abertas empilhadas, sinalizando avanço rápido ou ênfase.
Extras
- Espessura e cor se aplicam a toda a seta.
- Tamanho da ponta independente da espessura.
- Ponto na cauda adiciona um marcador inicial — ótimo para ponteiros antes/depois.
Usos
- Callouts de UI e tours de onboarding
- Diagramas e fluxogramas
- Ponteiros em apresentações
- Anotações estilo esboço em artes de marketing
- Ícones SVG para links, CTAs ou botões "leia mais"
A saída é SVG puro, então pode ser recolorida via CSS (fill / stroke), animada com stroke-dasharray ou importada em qualquer ferramenta de design.