mapcn

mapcn

Drop-in React map components

Description

Adding a map to a React app usually means paying per request for Google Maps or wrestling with MapLibre or Leaflet docs to style it, add markers, draw routes and support dark mode. A good-looking map can eat days.

mapcn packages all of that as ready-made components you add to your project with one command, following the shadcn/ui approach: the code lands in your repo and is yours to change. Maps render with MapLibre GL, styling uses Tailwind, light and dark themes are handled automatically, and the defaults already look great.

It's free and open source (MIT) with over twelve thousand GitHub stars. The default basemap is CARTO, which needs a license for commercial use, but you can switch to OpenStreetMap, MapTiler or any MapLibre-compatible tile provider.

Features



Zero config: one command to install, sensible defaults out of the box.

Theme-aware: map styles follow light and dark mode automatically.

Markers and popups: a rich marker system with popups, tooltips and labels.

Routes: draw routes and paths, handy for running, cycling or delivery UIs.

Controls: zoom, compass, locate and fullscreen controls.

Composable: build complex map UIs like dashboards, flight maps and globe views from declarative components.

Full MapLibre access: reach the underlying MapLibre GL API whenever you need it.