maps for developers

The (former) official Mapbox blog. See mapbox.com/blog for current content.

Follow publication

Designing Moonlight: A new custom map

Mapbox
maps for developers
2 min readJun 13, 2017

By Rasagy Sharma

Meet Moonlight, our latest designer style, ready to be used in your app or customized in Studio.

Moonlight map design

I created Moonlight using a minimal color palette to create a high contrast backdrop, designed for data visualizations or annotations. The color palette is paired with the modernists sans-serif type face Montserrat. Inspired by the early-twentieth century design movements that focused on functionality, this map is ready to be quickly added into your next app.

Moonlight uses only two shades of grey and a single type family, which makes it easy to customize to suit your brand colors and typography.

Moonlight with custom fonts and colors

To customize Moonlight, just add the style in Mapbox Studio and make changes by opening the Properties panel and replacing the dark and light grey color with your custom color. Similarly, you can switch the typeface from the Font Stacks section.

Get Moonlight for yourself, and start customizing the design. This is only the first of many new designer map we’re launching. Sign up for an account to get notified about the latest releases right in your inbox.

We want to see how your make each style your own, so share your designs with us on Twitter using the hashtag #BuiltWithMapbox.

Sign up to discover human stories that deepen your understanding of the world.

Written by Mapbox

mapping tools for developers + precise location data to change the way we explore the world

No responses yet

Write a response