---
title: "MapSpot — Framer component · Best of Framer"
description: "$20.00 · Framer component · by Injamul Haque Somrat · Maps. MapSpot is a polished, interactive world map component for Framer that lets you showcase multiple locations with customizable…"
canonical: "https://framer.elliotli.dev/component/mapspot"
---

[Home](/)/[Components](/components)/[Maps](/components/category/maps)/MapSpot

# MapSpot

Interactive Map for Framer

[View on Framer](https://framer.com/marketplace/components/mapspot/?via=elliot-li)

![MapSpot preview image 1](https://framer.elliotli.dev/og/component/mapspot/cc347c7435ac41c5/1600x1495.jpg)

## Summary

MapSpot is a polished, interactive world map component for Framer that lets you showcase multiple locations with customizable markers and information cards.

## Description

## MapSpot - Interactive Map for Framer

MapSpot is a polished, interactive world map component for Framer that lets you showcase multiple locations with customizable markers and information cards.

Add locations using latitude and longitude, customize marker colors and styles, and display additional information such as headings, subtitles, descriptions, images, and status badges. Clicking a marker switches the active location card, making it easy for visitors to explore multiple locations directly on the map.

### Features

\- Interactive world map with multiple location markers

\- Add unlimited custom map markers

\- Latitude and longitude positioning

\- Click markers to switch between location cards

\- Custom location headings and subtitles

\- Rich location descriptions

\- Customizable country colors and borders

\- Optional map grid / graticule

\- Custom ocean and land colors

\- Location cards automatically reposition to stay visible

### Setup

\- Open the Framer Remix and copy the component into your Framer project.

\- Add MapSpot to your page.

\- Add your locations from the Markers property.

\- Enter a heading, subtitle, description, image, latitude, and longitude for each location.

\- Customize the marker color and marker style.

\- Configure the map appearance from Map Style.

\- Customize the location information card from Card Style.

\- Optionally configure the countries, grid, header, and layout.

### Perfect For

\- Office location sections

\- Global company websites

\- Logistics and transportation websites

\- SaaS companies with global offices

\- Store and branch locators

\- Global presence sections

\- Distribution and service networks

\- Travel websites

\- Real estate websites

\- Event locations

\- Company headquarters

\- International business websites

For support, please include your project link, a short description of the issue, and a screenshot or screen recording when possible.

`injamulhaquesomrat@gmail.com`

## Rank history [How rankings work →](/terms#rankings)

-   All · #7399

## Details

- **Author**: Injamul Haque Somrat
- **Price**: $20.00
- **Published**: 2026-09-07
- **Updated**: 2026-09-08
- **Added**: 2026-09-07
- **Categories**: Maps

## More like this

-   [Waypoint](/component/waypoint) — Dev Ahsan · $9 — Photo-first locations map
-   [No-key Store Locator](/component/no-key-store-locator) — Sean Weekes · $15 — UK store finder, no Google API key
-   [Geo Office Location](/component/geo-office-location) — Design Foundry · Free — Interactive Global Office Showcase
-   [Map Locator CMS](/component/map-locator-cms) — sherwin · $15 — Map Locator CMS is a flexible, interactive map component for Framer that helps you showcase stores, offices, properties, venues, service…