Leaflet

Nov 2, 2026 — Leaflet 2.0 beta is out! See what's new and how to migrate from 1.x.

Leaflet is the leading open-source JavaScript library for building powerful interactive maps. Weighing just about 40 KB of JS, it has all the mapping features most developers ever need.

Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms, can be extended with lots of plugins, has a beautiful, easy to use and well-documented API and a simple, readable source code that is a joy to contribute to. It powers maps on millions of websites, with over 10 million npm downloads a week.

Here we create a map in the 'map' div, add tiles of our choice, and then add a marker with some text in a popup:

import {LeafletMap, TileLayer, Marker} from 'leaflet';

const map = new LeafletMap('map').setView([51.505, -0.159], 15);

new TileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', {
    attribution: '&copy; <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a>'
}).addTo(map);

new Marker([51.504, -0.159]).addTo(map)
    .bindPopup('A pretty CSS popup.<br>Easily customizable.')
    .openPopup();

Learn more with the quick start guide, check out other tutorials, or head straight to the API documentation. If you have any questions, take a look at the FAQ first.

Features

Leaflet doesn't try to do everything for everyone. Instead it focuses on making the basic things work perfectly.

Layers

  • Tile layers and WMS
  • Markers, popups and tooltips
  • Polylines, polygons, circles and rectangles
  • GeoJSON
  • Image, video and SVG overlays

Interaction

  • Panning with inertia
  • Zoom with the wheel, pinch, double tap or shift-drag
  • Same behavior for mouse, touch and pen
  • Draggable markers
  • Events on the map and every layer

Rendering

  • GPU-accelerated zoom and pan animations
  • SVG or Canvas vectors, clipped and simplified on the fly
  • Sharp on high-DPI screens
  • Fractional zoom levels
  • Follows the size of its container

Customization

  • Plain CSS for easy restyling
  • Image- and HTML-based markers
  • Custom layers and controls by extending standard JS classes
  • Custom projections (with EPSG:3857/4326/3395 built in)
  • Non-geographical maps for floor plans, game maps and images

Accessibility

  • Keyboard navigation of the map, markers and controls
  • Labeled controls and alt text for screen readers

Controls

  • Zoom buttons
  • Attribution
  • Layer switcher
  • Scale

For Developers

  • Tree-shakable ES modules
  • TypeScript types included
  • No dependencies
  • All modern browsers and devices

If you find some feature really missing in Leaflet, first check if there's a plugin for it and if it's been discussed before already on GitHub issues. If not, please open a new GitHub issue.

Getting Involved

Let's create the best mapping library in the world! Leaflet was originally created by Volodymyr Agafonkin, but is now developed by a big community of contributors. Pull requests are always welcome. However, there are many more ways to get involved with the development of Leaflet.

You can help the project tremendously by discovering and reporting bugs, improving documentation, helping others in GitHub Discussions, GIS Stack Exchange and GitHub issues, following Leaflet on Mastodon or X and spreading the word about Leaflet among your colleagues and friends.

Check out the contribution guide for more information on getting involved with Leaflet development.