Skip to content

Alidade Smooth

Designed for maps that use a lot of markers or overlays, our custom Alidade Smooth style is the ideal canvas for your complex map integration. Featuring a muted color scheme and fewer points of interest, Alidade Smooth lives to make your data shine.

Free

Starter

Standard

Professional

Preview and Use Alidade Smooth

Berlin
Berlin @ zoom 11

New York City
New York City @ zoom 11

San Francisco
San Francisco @ zoom 10

Static Maps Base URL
https://tiles.stadiamaps.com/static/alidade_smooth
Vector Style
https://tiles.stadiamaps.com/styles/alidade_smooth.json
Raster XYZ PNGs
https://tiles.stadiamaps.com/tiles/alidade_smooth/{z}/{x}/{y}{r}.png
Raster XYZ PNGs (for MapLibre)
https://tiles.stadiamaps.com/tiles/alidade_smooth/{z}/{x}/{y}@2x.png

What are these {x}, {y}, {z} things?

The {x}, {y}, and {z} placeholders represent x, y, and zoom following the standard slippy map tilename convention.

The {r} placeholder should be understood by most raster map libraries and will be replaced with @2x on devices with a HiDPI ("retina") display. If yours does not understand this (e.g., MapLibre GL JS), you can either remove this to get raw 256x256 PNGs, or manually replace it with @2x for 2x scale.

Raster TileJSON
https://tiles.stadiamaps.com/styles/alidade_smooth/rendered.json
1
2
3
4
5
6
7
8
// Initialize a map centered at (53, 12) at zoom level 5
var map = L.map('map').setView([53, 12], 5);

// Style URL format in XYZ PNG format; see our documentation for more options
L.tileLayer('https://tiles.stadiamaps.com/tiles/alidade_smooth/{z}/{x}/{y}{r}.png', {
    maxZoom: 20,
    attribution: '&copy; <a href="https://stadiamaps.com/">Stadia Maps</a>, &copy; <a href="https://openmaptiles.org/">OpenMapTiles</a> &copy; <a href="https://openstreetmap.org">OpenStreetMap</a> contributors',
}).addTo(map);
1
2
3
4
5
6
var map = new maplibregl.Map({
  container: 'map',
  style: 'https://tiles.stadiamaps.com/styles/alidade_smooth.json ',  // Style URL; see our documentation for more options
  center: [12, 53],  // Initial focus coordinate
  zoom: 4
});

Next Steps

Get Started With a Free Account