maps.stamen.com

For over a decade, Stamen has been exploring cartography with our clients and in research. These maps are presented here for your enjoyment and use wherever you display OpenStreetMap data.

Toner

These high-contrast B+W (black and white) maps are featured in our Dotspotting project. They are perfect for data mashups and exploring river meanders and coastal zones. Available in six flavors: standard toner, hybrid, labels, lines, background, and lite.

Available worldwide.

Terrain

Orient yourself with our terrain maps, featuring hill shading and natural vegetation colors. These maps showcase advanced labeling and linework generalization of dual-carriageway roads. Terrain was developed in collaboration with Gem Spear and Nelson Minar. Available in four flavors: standard terrain, labels, lines, and background.

Available in the USA only.

Watercolor

Reminiscent of hand drawn maps, our watercolor maps apply raster effect area washes and organic edges over a paper texture to add warm pop to any map. Watercolor was inspired by the Bicycle Portraits project. Thanks to Cassidy Curtis for his early advice.

Available worldwide.

Read about it

Burning Map

The roof, the roof, the roof is on fire! These "heat maps" use toner-lines as the foundation on which to draw fiery animations. It's our way of showing that maps don't have to lie still on the screen anymore, and that we can use the whole world as a canvas for interaction and movement.

Requires a WebGL-enabled browser, such as Google Chrome.

Trees, Cabs & Crime

Trees, Cabs & Crime started off as a weekend hack and ended up in the Venice Biennale. This map uses combines three data sets (street tree locations, taxi cab GPS positions, and crime reports) with subtractive blending to reveal halftones hidden in the urban fabric of San Francisco.

Available in San Francisco, California.

Read about it

How to Use These Tiles Elsewhere

Except otherwise noted, each of these map tile sets are © Stamen Design, under a Creative Commons Attribution (CC BY 3.0) license.

We’d love to see these maps used around the web, so we’ve included some brief instructions to help you use them in the mapping system of your choice. These maps are available free of charge. If you use the tiles we host here, please use this attribution:

Attribution:

Map tiles by Stamen Design, under CC BY 3.0. Data by OpenStreetMap, under CC BY SA. <COPY HTML>

If you roll your own tiles from another source you will still need to credit “Map data by OpenStreetMap, under CC-BY-SA.” And if you do use these maps elsewhere, please post a tweet to @stamen!

JavaScript Libraries

To use these tiles, just include our JavaScript alongside your favorite mapping library:

<script type="text/javascript" src="http://maps.stamen.com/js/tile.stamen.js?v1.2.1"></script>

Then, follow the instructions below for your preferred library:

ModestMaps

ModestMaps is a no-frills mapping library by Stamen and friends. View the example.

// replace "toner" here with "terrain" or "watercolor"
var layer = new MM.StamenTileLayer("toner");
var map = new MM.Map("element_id", layer);
map.setCenterZoom(new MM.Location(37.7, -122.4), 12);

Leaflet

Leaflet is a lightweight and easy-to-use library by Cloudmade. View the example.

// replace "toner" here with "terrain" or "watercolor"
var layer = new L.StamenTileLayer("toner");
var map = new L.Map("element_id", {
    center: new L.LatLng(37.7, -122.4),
    zoom: 12
});
map.addLayer(layer);

OpenLayers

OpenLayers is a hefty and featureful mapping library for use with a variety of GIS applications. View the example.

// replace "toner" here with "terrain" or "watercolor"
var layer = new OpenLayers.Layer.Stamen("toner");
var map = new OpenLayers.Map("element_id");
map.addLayer(layer);

Google Maps

The Google Maps API is ubiquitous and feature-rich, but requires an API key and may cost money if your usage exceeds 25,000 map views per day. View the example.

// replace "toner" here with "terrain" or "watercolor"
var layer = "toner";
var map = new google.maps.Map(document.getElementById("element_id"), {
    center: new google.maps.LatLng(37.7, -122.4),
    zoom: 12,
    mapTypeId: layer,
    mapTypeControlOptions: {
        mapTypeIds: [layer]
    }
});
map.mapTypes.set(layer, new google.maps.StamenMapType(layer));

On Your iPhone

OpenMaps is a free iPhone application from IZE, Ltd. that can display map tiles from sources you configure.

Under Settings → Type → Edit, add a new map type and enter one of these values:

http://tile.stamen.com/toner/<zoom>/<x>/<y>.png
http://tile.stamen.com/terrain/<zoom>/<x>/<y>.jpg
http://tile.stamen.com/watercolor/<zoom>/<x>/<y>.jpg

SSL

If you'd like to display these map tiles on a website that requires HTTPS, use our SSL endpoint by replacing http://tile.stamen.com with https://stamen-tiles.a.ssl.fastly.net. Multiple subdomains can be also be used: https://stamen-tiles-{S}.a.ssl.fastly.net