Skip to content
Cuelark UI

Hover the icon or press Play. Suggested motion: drop. Pick another to preview it and update the animated code:

Font Awesome 6 · FaMapLocation

Map Location icon

A free map location icon from Font Awesome 6, ready for React. Use it static or animated: both versions are below, copy-paste or one shadcn command away. Sized in em and colored by currentColor.

Also known asnavigation iconroute icondirections iconpin iconplace iconmarker iconaddress icongps icon
License
CC BY 4.0 license
Project
fontawesome.com
Download SVG
Install with shadcn
npx shadcn@latest add https://ui.cuelark.com/r/icons/font-awesome-6/map-location.json
components/icons/font-awesome-6-map-location.tsx
import * as React from "react";

/**
 * Map Location from Font Awesome 6 (https://fontawesome.com/), CC BY 4.0 License.
 * Via Cuelark UI: ui.cuelark.com/icons/font-awesome-6/map-location. Sized in em, colored by currentColor.
 */
export function FaMapLocationIcon(props: React.SVGProps<SVGSVGElement>) {
  return (
    <svg
      aria-hidden="true"
      viewBox="0 0 576 512"
      stroke="currentColor"
      fill="currentColor"
      strokeWidth="0"
      width="1em"
      height="1em"
      xmlns="http://www.w3.org/2000/svg"
      {...props}
    >
      <path
        d="M302.8 312C334.9 271.9 408 174.6 408 120C408 53.7 354.3 0 288 0S168 53.7 168 120c0 54.6 73.1 151.9 105.2 192c7.7 9.6 22 9.6 29.6 0zM416 503l144.9-58c9.1-3.6 15.1-12.5 15.1-22.3L576 152c0-17-17.1-28.6-32.9-22.3l-116 46.4c-.5 1.2-1 2.5-1.5 3.7c-2.9 6.8-6.1 13.7-9.6 20.6L416 503zM15.1 187.3C6 191 0 199.8 0 209.6L0 480.4c0 17 17.1 28.6 32.9 22.3L160 451.8l0-251.4c-3.5-6.9-6.7-13.8-9.6-20.6c-5.6-13.2-10.4-27.4-12.8-41.5l-122.6 49zM384 255c-20.5 31.3-42.3 59.6-56.2 77c-20.5 25.6-59.1 25.6-79.6 0c-13.9-17.4-35.7-45.7-56.2-77l0 194.4 192 54.9L384 255z"
      />
    </svg>
  );
}
With react-icons
import { FaMapLocation } from "react-icons/fa6";

export function Example() {
  return <FaMapLocation className="size-5" />;
}
map-location.svg
<svg
  viewBox="0 0 576 512"
  stroke="currentColor"
  fill="currentColor"
  stroke-width="0"
  width="1em"
  height="1em"
  xmlns="http://www.w3.org/2000/svg"
>
  <path
    d="M302.8 312C334.9 271.9 408 174.6 408 120C408 53.7 354.3 0 288 0S168 53.7 168 120c0 54.6 73.1 151.9 105.2 192c7.7 9.6 22 9.6 29.6 0zM416 503l144.9-58c9.1-3.6 15.1-12.5 15.1-22.3L576 152c0-17-17.1-28.6-32.9-22.3l-116 46.4c-.5 1.2-1 2.5-1.5 3.7c-2.9 6.8-6.1 13.7-9.6 20.6L416 503zM15.1 187.3C6 191 0 199.8 0 209.6L0 480.4c0 17 17.1 28.6 32.9 22.3L160 451.8l0-251.4c-3.5-6.9-6.7-13.8-9.6-20.6c-5.6-13.2-10.4-27.4-12.8-41.5l-122.6 49zM384 255c-20.5 31.3-42.3 59.6-56.2 77c-20.5 25.6-59.1 25.6-79.6 0c-13.9-17.4-35.7-45.7-56.2-77l0 194.4 192 54.9L384 255z"
  />
</svg>
Attribution
"Map Location" icon from Font Awesome 6 (https://fontawesome.com/), licensed under CC BY 4.0 license.

Related icons: navigation, route, directions, pin

Map Location icon in other sets