Menu

Hook Arrow SVG element, flat

Hook Arrow SVG element, flat

This vertical arrow curls into a tight hook before pointing down. Use it to indicate a return move in a process diagram or a turning path on a route sketch.

Similar SVGs

More from Hand-Drawn Arrows, Flat · Set 2

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/NyRR0_1lpUe1/amnt.svg" alt="Hook Arrow" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 1024" width="1024" height="1024"><g id="turquoise" data-name="Turquoise"><path d="M639 672c-11-40 23-229 28-286 8-88 11-189-42-265-102-146-356-100-373 85-4 39 7 92 47 109 43 18 94-24 56-64-67-70 48-168 133-103 73 56 56 174 44 252-9 63-21 124-31 186-5 28-13 58-13 86-18 0-111-4-120 3-8 6-4 14 0 21 20 31 40 62 61 93 20 31 40 62 61 93 7 12 55 89 63 90 3 0 5-1 8-3 6-3 50-73 58-85 20-30 41-60 61-91 21-31 41-61 62-91 5-8 14-17 6-26-6-7-94-4-109-4z" fill="#01c2aa" stroke="#01c2aa"/></g><g id="navy" data-name="Navy"><path d="M660 650c0-171 92-401-24-552-106-138-351-105-400 69-16 59-6 154 66 172 20 5 39 3 56-7 28-16 43-51 26-80-5-8-13-14-19-23-28-43 26-82 66-80 18 1 35 9 49 21 54 50 42 139 33 204-8 62-20 125-31 188-5 28-6 60-15 88-18 0-37 0-55 0-29 0-80-4-70 43 3 13 54 87 66 104 22 34 44 69 67 103 11 17 47 79 60 88 4 3 10 6 16 6 7 1 16-1 22-6 12-8 48-67 59-83 22-34 45-68 68-101 15-22 29-44 44-65 8-12 18-24 25-37 4-9 5-19 3-28-3-11-13-20-24-23-20-5-65-1-88-1zm-21 22c15 0 103-3 109 4 8 9-1 18-6 26-21 30-41 60-62 91-20 31-41 61-61 91-8 12-52 82-58 85-3 2-5 3-8 3-8-1-56-78-63-90-21-31-41-62-61-93-21-31-41-62-61-93-4-7-8-15 0-21 9-7 102-3 120-3 0-28 8-58 13-86 10-62 22-123 31-186 12-78 29-196-44-252-85-65-200 33-133 103 38 40-13 82-56 64-40-17-51-70-47-109 17-185 271-231 373-85 53 76 50 177 42 265-5 57-39 246-28 286z" fill="#012155" stroke="#012155"/></g></svg>
CSS background-image
.hook-arrow {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/NyRR0_1lpUe1/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.hook-arrow {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/NyRR0_1lpUe1/amnt.svg") center / contain no-repeat;
}
React
import HookArrowSvg from "./hook-arrow.jsx"; // from the React tab above

<HookArrowSvg width={48} height={48} />

Tags

Made with AMNT

AMNT Draw 1.2 drew this from the words Hook Arrow: A vertical shaft curls into a tight hook and ends with a downward arrowhead. A flat element. Simplify the spiral into a clear tight hook that flows directly into the downward arrowhead, and smooth the pinched arrowhead junction. as part of the pack Hand-Drawn Arrows, Flat · Set 2. Want one like it? Make your own in the SVG studio.

Licence: free. A Free account may use it for personal work; Pro and Max download it with a commercial licence, fixed at download, forever. No credit needed. Read the licence

Settings