Menu

Beta
Sign in
Beta
Crossing Arrows SVG element, flat

Crossing Arrows SVG element, flat

Two diagonal arrows cross at their centres and point toward opposite upper corners. Use them to mark intersecting paths on a map or diverging trends in a chart.

Free · from Hand-Drawn Arrows, Flat

Similar SVGs

More from Hand-Drawn Arrows, Flat

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/_L_-wwT0njGh/amnt.svg" alt="Crossing Arrows" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="currentColor"><path d="M20 20h58L62 36l47 47 47-47-16-16h40v58l-16-16-47 47 55 55-16 16-55-55-55 55-16-16 55-55-47-47-18 16V20z"/></svg>
CSS background-image
.crossing-arrows {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/_L_-wwT0njGh/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.crossing-arrows {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/_L_-wwT0njGh/amnt.svg") center / contain no-repeat;
}
React
import CrossingArrowsSvg from "./crossing-arrows.jsx"; // from the React tab above

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

Tags

crossingarrowsintersectdirectionselementflat

Made with AMNT

AMNT SVG 1.1 drew this from the words Crossing Arrows: Two diagonal arrows cross at their centres, with arrowheads at opposite upper corners. as part of the pack Hand-Drawn Arrows, Flat. 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