Menu

Beta
Sign in
Beta
Arrow Back SVG icon, line

Arrow Back SVG icon, line

A left-pointing arrow bends down into a return path. Use it for a back control in a mobile header or a return step in a flowchart.

Free · from Arrows icons, line · Set 2

Similar SVGs

More from Arrows icons, line · Set 2

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/hDs34iHox1G6/amnt.svg" alt="Arrow Back" 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="cobalt" data-name="Cobalt"><path d="M338 92c-12 2-111 80-129 94-23 16-45 34-68 50-19 15-42 28-58 45 11 12 27 22 40 32 29 21 58 43 87 65 17 12 117 91 128 92v-123c103 0 205 0 308 0 96 0 154 55 154 153 0 102 0 204 0 307 0 43 5 87 57 95 46 7 81-26 81-70 1-103 0-205 0-307 0-98-3-160-72-234-90-98-200-85-320-85-70 0-139 0-208 0z" fill="#013371" stroke="#013371"/></g><g id="midnight" data-name="Midnight"><path d="M359 185c0-21 4-82-2-98s-24-18-37-10c-27 15-62 47-88 66-31 22-60 44-90 67-16 12-63 42-72 55-5 6-6 13-5 21 1 4 2 8 5 11 10 13 63 49 79 61 30 21 59 44 89 66 14 11 78 62 90 65s25-3 29-15c6-17 2-84 2-106 71 0 141 0 212 0 33 0 67-2 100 0 26 2 49 13 68 29 52 45 41 113 41 175s0 124 0 187c0 28-3 58 0 86 1 10 4 21 9 30 44 86 167 53 170-43 3-104 0-209 0-312 0-96-7-166-74-239-95-103-193-96-322-96-68 0-136 0-204 0zM338 92v114c69 0 138 0 208 0 120 0 230-13 320 85 69 74 72 136 72 234 0 102 1 204 0 307 0 44-35 77-81 70-52-8-57-52-57-95 0-103 0-205 0-307 0-98-58-153-154-153-103 0-205 0-308 0v123c-11-1-111-80-128-92-29-22-58-44-87-65-13-10-29-20-40-32 16-17 39-30 58-45 23-16 45-34 68-50 18-14 117-92 129-94z" fill="#010f25" stroke="#010f25"/></g></svg>
CSS background-image
.arrow-back {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/hDs34iHox1G6/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.arrow-back {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/hDs34iHox1G6/amnt.svg") center / contain no-repeat;
}
React
import ArrowBackSvg from "./arrow-back.jsx"; // from the React tab above

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

Tags

backreturnarrownavigationarrowsiconline

Made with AMNT

AMNT Draw 1.2 drew this from the words Arrow Back: A left-pointing arrow starts at the right and bends down into a return path. A flat colour icon. as part of the pack Arrows icons, line · 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