map icon

map from Font Awesome Solid by Dave Gandy · Solid · Camping · CC-BY-4.0 Attribution required.

Name
map
Set
Font Awesome Solid
Style
Solid
Category
Camping
Viewbox
640×640
License
CC BY 4.0

The same icon in other sets

mapAkar IconsmapBootstrap IconsmapBoxIcons v2mapBoxIcons v2 SolidmapCarbonmapCodiconsmap-fillEva IconsmapFramework7 IconsmapFont Awesome 6 RegularmapFont Awesome 6 SolidmapFont Awesome RegularmapFeather Iconsmap-16-filledFluent UI System IconsmapHeroIconsmapHuge IconsmapHumbleiconsmapIconoirmapIonIconsmapJam IconsmapLine AwesomemapLucidemapMajesticonsmapMaterial SymbolsmapMaterial Symbols Light

More camping icons from Font Awesome Solid

binocularsfaucetfirefire-altfirst-aidmap-markedmap-marked-altmap-signsroutetoilet-papermap-markermap-marker-altmap-pinmap-locationmap-location-dot

Use the map icon

SVG

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M576 112c0-11.1-5.7-21.4-15.2-27.2s-21.2-6.4-31.1-1.4l-116.2 58.1l-179.4-59.9c-8.1-2.7-16.8-2.1-24.4 1.7l-128 64C70.8 152.8 64 163.9 64 176v352c0 11.1 5.7 21.4 15.2 27.2s21.2 6.4 31.1 1.4l116.1-58.1l179.4 59.8c8.1 2.7 16.8 2.1 24.4-1.7l128-64c10.8-5.4 17.7-16.5 17.7-28.6V112zM256 440.9V156.4l128 42.7v284.5z"/></svg>

React

import type { SVGProps } from "react";

export function Fa7SolidMap(props: SVGProps<SVGSVGElement>) {
  return (
    <svg {...props} xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M576 112c0-11.1-5.7-21.4-15.2-27.2s-21.2-6.4-31.1-1.4l-116.2 58.1l-179.4-59.9c-8.1-2.7-16.8-2.1-24.4 1.7l-128 64C70.8 152.8 64 163.9 64 176v352c0 11.1 5.7 21.4 15.2 27.2s21.2 6.4 31.1 1.4l116.1-58.1l179.4 59.8c8.1 2.7 16.8 2.1 24.4-1.7l128-64c10.8-5.4 17.7-16.5 17.7-28.6V112zM256 440.9V156.4l128 42.7v284.5z"/></svg>
  );
}

Vue

<template>
  <svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 640 640"><path fill="currentColor" d="M576 112c0-11.1-5.7-21.4-15.2-27.2s-21.2-6.4-31.1-1.4l-116.2 58.1l-179.4-59.9c-8.1-2.7-16.8-2.1-24.4 1.7l-128 64C70.8 152.8 64 163.9 64 176v352c0 11.1 5.7 21.4 15.2 27.2s21.2 6.4 31.1 1.4l116.1-58.1l179.4 59.8c8.1 2.7 16.8 2.1 24.4-1.7l128-64c10.8-5.4 17.7-16.5 17.7-28.6V112zM256 440.9V156.4l128 42.7v284.5z"/></svg>
</template>

CSS

.icon-map {
  width: 24px;
  height: 24px;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M576%20112c0-11.1-5.7-21.4-15.2-27.2s-21.2-6.4-31.1-1.4l-116.2%2058.1l-179.4-59.9c-8.1-2.7-16.8-2.1-24.4%201.7l-128%2064C70.8%20152.8%2064%20163.9%2064%20176v352c0%2011.1%205.7%2021.4%2015.2%2027.2s21.2%206.4%2031.1%201.4l116.1-58.1l179.4%2059.8c8.1%202.7%2016.8%202.1%2024.4-1.7l128-64c10.8-5.4%2017.7-16.5%2017.7-28.6V112zM256%20440.9V156.4l128%2042.7v284.5z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%221em%22%20height%3D%221em%22%20viewBox%3D%220%200%20640%20640%22%3E%3Cpath%20fill%3D%22currentColor%22%20d%3D%22M576%20112c0-11.1-5.7-21.4-15.2-27.2s-21.2-6.4-31.1-1.4l-116.2%2058.1l-179.4-59.9c-8.1-2.7-16.8-2.1-24.4%201.7l-128%2064C70.8%20152.8%2064%20163.9%2064%20176v352c0%2011.1%205.7%2021.4%2015.2%2027.2s21.2%206.4%2031.1%201.4l116.1-58.1l179.4%2059.8c8.1%202.7%2016.8%202.1%2024.4-1.7l128-64c10.8-5.4%2017.7-16.5%2017.7-28.6V112zM256%20440.9V156.4l128%2042.7v284.5z%22%2F%3E%3C%2Fsvg%3E") no-repeat center / contain;
}

Direct links: SVG · download · JSON · https://iconsdb.app/api/v1/icon/fa7-solid/map.svg?color=%231a73e8&size=48