Mobile app version of vmapp.org
Login or Join
Turnbaugh909

: How to create a modern arrow with Photoshop's line tool? I'm attempting to create a stylized breadcrumb (below) but am botching the arrow. Is there a more precise and 'economical' method of

@Turnbaugh909

Posted in: #AdobePhotoshop #HowTo #Technique #WebsiteDesign

I'm attempting to create a stylized breadcrumb (below) but am botching the arrow.

Is there a more precise and 'economical' method of creating this type of arrow? Preferably one where I retain control of the stroke width and corner radius.

The way I've typically created this arrow is by:


Creating a line via the Line Tool
Rotating my line (appox. 45º
clockwise)
Duplicating that line Flipping my new line vertically
Nudging the lines until they touch
Merging the two lines into a new shape
Creating a clipping mask
Then, vertically aligning my new shape within my clipping mask


I'm increasingly having to create these 'modern' arrows for carousels and other UI scenarios and I'm never 100% happy with how they come out. Thanks in advance for your help.

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Turnbaugh909

1 Comments

Sorted by latest first Latest Oldest Best

 

@Caterina889

Draw a rectangle.

Use the Pen Tool to add an anchor to one side.

Hold down the Option/Alt and click the anchor point again (with the Pen Tool still). This will convert the new anchor to a corner point rather than a smooth point. This ensures the paths remain straight rather than curved.

Use the Direct Selection Tool (white arrow) to select and drag that anchor outward forming the arrow.

Choose Edit > Define Custom Shape



In the future, all you need do is draw your custom shape and apply a mask (if needed) and color to it.

The angle of the arrow can always be altered by simply grabbing the Direct Selection tool again and editing the custom shape you've drawn.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme