Drawing arrows by using shapes?

Hi -
Is there some work around that folks use in order to draw arrows?

Thank you!

What are you referring to Matt? Drawing using Hype’s shapes? or drawing using code?

I generally use an image if I want arrows.


I think I’d like to know about both options. I too use images generally but I have a situation where I need several arrows as part of diagram…

Would emoji’s work? Or maybe using the annotate function in Preview.app

There are many ways to achieve this.

My preferred method is to use an SVG image file (or set of files). By using controls inside of Hype you can vary the size and orientation of this base arrow to get an infinite set of unpixelated arrows from one small SVG file.

Like this example where all the arrows come from the same SVG:

arrow.hype.zip (11.5 KB)


This is great. Is there a way to adjust the length and width of the line independent of the arrow head?

Only by editing the underlying SVG.

That is why you might choose to use a set of these arrows with different relative lengths and/or aspect ratios.

What if you just had a transparent png for the arrow head and a Hype rectangle with 2-3 pixel width as the line? Then you can change the thickness and size of the rectangle in hype and just move the arrow head to the front of it.

1 Like

No need for any SVG.arrow.hype.zip (10.6 KB)