Menu

Beta
Sign in
Location Pin SVG icon, rounded

Location Pin SVG icon, rounded

A map pin marks a place or geographic location. Add it to a store locator website or a mobile app map to identify an address, destination, or nearby service.

Free · from Rounded Interface Icons

Similar SVGs

More from Rounded Interface Icons

Whole pack

How to use it

HTML <img>
<img src="https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/ZJThzXO1A4oq/amnt.svg" alt="Location Pin" width="48" height="48">
Inline SVG
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" width="64" height="64"><g id="layer-1" data-name="Group 1"><path d="M50 28C50 18.06 41.94 10 32 10C22.06 10 14 18.06 14 28C14 39 27 50.5 30.6 53.4C31.42 54.06 32.58 54.06 33.4 53.4C37 50.5 50 39 50 28Z" fill="#a8dadc" stroke="#264653" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/><path d="M39 28C39 31.87 35.87 35 32 35C28.13 35 25 31.87 25 28C25 24.13 28.13 21 32 21C35.87 21 39 24.13 39 28Z" fill="none" stroke="#264653" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></g></svg>
CSS background-image
.location-pin {
  background-image: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/ZJThzXO1A4oq/amnt.svg");
  background-size: contain;
}
CSS mask-image (takes the text colour)
.location-pin {
  width: 1.5em; height: 1.5em;
  background-color: currentColor;
  mask: url("https://db.amnt.io/storage/v1/object/public/generated_images/svg-api/ZJThzXO1A4oq/amnt.svg") center / contain no-repeat;
}
React
import LocationPinSvg from "./location-pin.jsx"; // from the React tab above

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

Tags

locationpinmapaddress

Made with AMNT

AMNT SVG Pro 1.1 drew this from the words Location pin. Flat, rounded icons in a consistent set. Use two colours and clean 2 px lines with rounded ends and corners. Keep the shapes simple, balanced, and easy to recognise at small sizes. Use the same proportions, line weight, and colour placement for every icon. as part of the pack Rounded Interface Icons. 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