How to style a retro map

Map design Advanced cartography examples

This set of articles represents a recommended selection of advanced cartography examples.

1. How to make custom map design in MapTiler Cloud
2. How to style a retro map
3. How to style a pop art map
4. Map styled like a picture
5. How to make an Oktoberfest map
6. How to style a choropleth map in the Customize
7. How to use MapTiler Ocean

How do you achieve an old-school look & feel for a basemap? What colors, fonts, or features define a retro or vintage map style? If you’re wondering how to design a retro map in MapTiler Customize, keep reading!

Map color palette

The first thing you should focus on is the choice of colors. My tip is to start from deeper zoom levels and then adjust as you go up. I started from the Bright map style and zoomed in so that I could see buildings. Retro maps typically use pastel colors:  variations of brown, beige, and dusty pink to imitate the aged and worn feeling.

To create additional colors in the same style, I use different opacity or lightness values.

Map features

The next step is the selection of features that should be included in the map. The Bright map style I started from is quite rich, so I decided to get rid of a few layers:

• Sand
• Water offset
• River tunnel
• Tunnel path
• Ferry
• Ferry labels
• Oneway road
• Highway shields
• Building top
• Transport
• Shopping
• Sport
• Food
• Drink
• Other POI

To reduce the number of POIs further, I went into the Amenity Data tab and included only bank, cemetery, library, park, post, and town_hall classes. I also removed all icons except for the star in Capital City labels and the circle in City labels.

Fonts and labels

What’s typical for old-looking maps is the use of Serif fonts to imitate the look of traditional typefaces from the age of Johannes Gutenberg. In MapTiler Customize, you can choose from multiple Serif font families: Cinzel, Libre Baskerville, Merriweather, Noto Serif, PT Serif, and Vollkorn. 

Next, you should think about different font types to differentiate between labels or to create a hierarchy. For more important features, use Bold types; for emphasizing a difference, use Italic. 

I used the following Merriweather types for label layers:

• Bold: Continent, Country, and Capital city labels
• Regular: City, Island, Town, and Road labels
• Italic: State, Place, Lake, Sea, and Ocean labels
• Light: Village labels
• Light Italic: River labels

For POI layers, I used Light Italic up to Zoom 16, then from Zoom 16 a classic Italic so that the labels are readable on top of the Buildings.

To differentiate between different kinds of labels, I also leveraged the letter spacing.

• 0em (none): Town, Village labels
• 0.1em: Lake, Sea, Lakeline, River, Island, Airport labels, and all POI layers
• 0.2em: Capital city, State, and City labels
• 0.3em: Continent and Country labels
• 0.4em: Road labels

You can also transform some of the labels to uppercase, which I did for Continent, Country, Capital city, State, Island, and Place labels.

For better readability, I added a halo to all labels, using #F9F1DC color, 80% opacity, width ranging from 1 to 1.5px, and a bit of blur.

Patterns and icons

Many old maps are easily recognizable by their imperfect paper texture and patina, indicating usage over the years. This feeling can be mimicked by creating an SVG seamless dot pattern designed in graphic software such as Inkscape. 

The key here is not to make all the dots the same. You can start from perfectly symmetrical dots and then distort them randomly. The background needs to be transparent.

I tried to keep it simple with icons, as there are usually not that many on vintage maps. It is more common to have unique drawings alongside the actual map, but that would take a lot more work in Inkscape! I kept only star and circle icons for Capital cities and Cities. I recommend you keep these kind of icons around 15x15 px in size.

Compress all files into one ZIP and upload it to your map. The Icons upload is available in the menu in the top-right corner. I toggled off the Convert to customizable icons (SDF sprite)option to have the icons rasterized. 

For the pattern styling, I created two additional layers: The background pattern on top of the Background and the Water pattern on top of the Water layer and made their opacity 5%.

Retro map

Now we have a styled Retro map! Check out your favourite locations or just zoom around and enjoy the blast from the past.  

Downloadable resources

• retro_icons.zip

Next steps

Continue to How to style a pop art map to learn how to create a look of classic comic books for a basemap.