Getting Started
Beautiful, customizable map components for Svelte applications.
mapcn is a collection of map components built on top of MapLibre GL JS and styled with Tailwind CSS. It integrates seamlessly with shadcn-svelte.
Features
- Interactive maps with zoom, pan, and rotation
- Customizable markers with labels, popups, and tooltips
- Route drawing for paths and directions
- Automatic light/dark theme switching
- Built-in controls for zoom, compass, and geolocation
- No API key required - uses free CARTO basemap tiles
Basic Route
Draw a route with numbered stop markers along the path.
Dynamic Route from OSRM
Fetch real driving directions from the OSRM API and display them on the map.
Quick Start
Head to the Installation guide to add mapcn to your project, then explore the examples to see what's possible.