If you installed a fresh copy of TileMill from the 0.3 series (we’re now up to 0.3.2), you may have noticed a new example stylesheet that comes included — ‘Open Streets DC’. By popular demand, this sample project shows off some of what TileMill can do at the street level, unlike the other examples that focus on world and country-level views.

Open Streets DC — data © OpenStreetMap contributors, CC-BY-SA.

The project relies on shapefiles of OpenStreetMap data provided by CloudMade. While the example uses shapefiles covering just the District of Columbia, the style was created with more than just DC in mind. You could swap these out for CloudMade shapefiles of any part of the world and still get a nicely styled map.

For example, here is the same style applied to a section of Ontario, Canada:

To find shapefiles covering your area of interest, browse downloads.cloudmade.com and download any zip file with ‘shapefiles’ in the name. The comments in the project stylesheets will give you some pointers on how to prepare these shapefiles for use in TileMill.

The stylesheet takes advantage of some convenient features of Carto to make further customization even simpler. The entire design is based off a palette of eight base colors, with variations automatically calculated for outlines, text, and halos.

For example, the highway base color is a variable defining the fill, and the outlines, label text, and text-halos are all based on that color, generated by applying the lighten() and darken() color functions to that color. If you change the definition of the base variable, all the related colors will change along with it. The spin() function rotates the hue around the color wheel to make the darkening effect a bit nicer.

Taking advantage of color variables and functions in TileMill

Open Streets DC comes with new installations of TileMill, but you may not have it if you have the latest TileMill version via an upgrade, since upgrades don’t alter your existing project folder. To get it you can grab it from our TileMill Examples GitHub repository.