Bring our latest features and data to your users with our beautifully redesigned Core Styles

New user-friendly features to our Core Style base maps based on 2022 design trends

Topi Tjukanov
William Davis

Nov 18, 2022

Bring our latest features and data to your users with our beautifully redesigned Core Styles

New user-friendly features to our Core Style base maps based on 2022 design trends

Guest

Topi Tjukanov
William Davis

Guest

Nov 18, 2022

The beautiful Mapbox Core Style base maps are created by the industry’s best cartographic designers and save developers countless hours they would have spent building their own base maps. They can be used exactly as they have been built, or as a base layer that can be customized with location data and design elements. 

Core Style base maps are intentionally designed to meet the broadest range of customer use cases and can be styled on the client side, or developers can edit the style.json file themselves. Core Style base maps are available in Mapbox Studio, enabling maps that fit seamlessly with any brand to be created by providing full design control over icons and textures to delight users.

We know it’s essential that developers, designers and organizations deliver a contemporary and engaging map experience to their end users, so we periodically redesign our Core Style base maps with modern trends to ensure that they look as cutting edge as they function. In 2022, some notable design trends included minimalism, simplified UX, vivid colors and immersive 3D.

Influenced by these trends, the 2022 redesign of five of our Core Style base maps: 

  • offers sleek contemporary motifs without sacrificing functionality.
  • builds on our industry-leading performance.
  • applies subtle-but-clever touches to improve map interactivity.
  • layers in even more location data to make base maps easier to navigate – particularly for pedestrians. 

All of these improvements create a rich experience in which people can discover the world around them.

Mapbox Core Styles

Five Core Style Updates

Mapbox Streets – A fresh color palette and easier to read road networks

The comprehensive, general-purpose style called Mapbox Streets is now updated with a clean and fresh color palette and includes more accurate and legible place labels and points of interest (PoIs). Plus, we’ve redesigned the style of roads and transit networks for easier viewing. Improved visual hierarchy and simplified settings for the layers in Mapbox Studio now make this style easier to customize.

Mapbox Streets Core Style changes

The result is an intuitive and predictable visual hierarchy that allows straightforward navigation on each zoom level. Pedestrians can navigate through unfamiliar territory with ease by search, tourists are better informed of store and restaurant locations for itinerary planning, and drivers can identify and build routes efficiently. 

Mapbox Outdoors – Making it easy to discover outdoor adventure

Mapbox Outdoors is a general-purpose map focused on wilderness locations with curated tilesets that now include easy-to-distinguish paths, trails and tracks, as well as rocks and mountain peaks. These updates are specially tailored to hiking, biking, skiing and other adventurous use cases.

Mapbox Outdoors Core Style changes

What's more, natural features such as terrain gradients are emphasized with shading and contour lines, while bold colors distinguish the roads. Using Mapbox Outdoors, those with an affinity for adventure can explore the wild with better and safer navigation.

Mapbox Satellite Streets – The perfect canvas for displaying your data

This is a hybrid base map that combines Mapbox Satellite with vector data from Mapbox Streets.

Mapbox Satellite Streets Core Style changes

Road opacity and icon saturation are increased for improved legibility. These updates create a clean and modern look that improves Mapbox Satellite Streets’ utility as a blank canvas or an overlay for your data.

Mapbox Light and Dark – Streamlined aesthetic for your custom data 

The subtle light and dark maps have been simplified even further, providing an effective canvas to tell your location story.

Mapbox Light Core Style changes

Some significant changes include adjusted land use density for simplified styles and changed water style for a streamlined aesthetic. In addition, the settlement density is adjusted to make fewer names visible so that more room is available for highlighting custom data.

Apart from being a simplified canvas for data visualization, these styles are a great starting point for creating brand new styles.

Mapbox Dark Core Style changes

The only thing to do is change the base color and adjust the icons in Mapbox Studio.

More Updates For Every Style

The following updates apply across several or all of our Core Style base maps.

Globe & atmosphere updates

At low zoom levels, all Core Style base maps will now default to Globe View. In addition, they will include fog and atmospheric properties. This means the flat and skewed Mercator Projection is not your default option when aiming to realistically display visual information that is continental in scale.

Mapbox Globe View

We’ve made it easier to navigate the world when spinning the Globe by adding:

  • a lightweight ocean-detail layer displaying more realistic ocean depth (bathymetry).
  • improved city labeling. 
  • a simplified road network.

Icons and pedestrian accessibility

Mapbox Streets and Outdoors PoI icons now have background shapes and more pronounced colors, making them particularly more viewable on mobile devices. In Mapbox Studio, icons can be customized with different shapes, sizes and colors based on classification. Presence of pedestrian labels such as crosswalks, building entrances, fences, and gates have also been increased to make foot navigation efficient, safer and more accessible.

New icons and pedestrian accessibility in Mapbox Studio

We have further improved wayfinding with commercial, industrial and residential land use classifications that appear at higher zoom levels. These layers make it easier for users to see when they’re walking into an area of concentrated activity or a restricted zone.

New commercial, industrial and residential land use classifications

Internationalize your maps

Our new components make it easy to prepare the Core Styles for Internationalization - a new capability - just by setting one configuration in the UI. Previewing the language/worldview of your map in Studio is also available using the Studio preview feature.

With Mapbox Maps Internationalization, developers can significantly reduce the number of custom styles needed to dynamically display a wide range of maps in the local language and worldview of their customer’s preference. No more building potentially hundreds of discreet styles – one for each permutation of language and worldview – saving hours or even days of coding and verification, not to mention future maintenance.

Previewing the language/worldview of your map in Studio is currently in a private beta and will be made more widely available soon.

Faster loading, processing, and rendering

To optimize new stylistic updates, we have improved our overall map performance to accelerate load times and faster rendering performance, even when adding new and complex layers.

Other enhancements include: 

  • improved expression syntax with more performant codes, 
  • lower device power consumption, and 
  • overall improvements to the Frame Time Average.

Our maps maintain ~60 fps while optimizing for higher frame-per-second processing when possible.

Explore Our New UX Today!

For guidance on how to leverage the new Mapbox Core Style base maps for your app or service, visit our documentation page.

These base maps are also available in Mapbox Studio where you can easily interact and customize the style based on your needs.

The Mapbox Map Design team is continually improving our core styles and we would love to hear your feedback. Feel free to reach out to hey-map-design@mapbox.com to let us know what you think and share your styles with us.  

If you are not developing on Mapbox yet, you can create an account for free today. 

Get Started


const map = new mapboxgl.Map({
container: 'map',
style: 'mapbox://styles/mapbox/streets-v12',
center: [-74.5, 40],
zoom: 9
});

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5
Heading 6

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.

Block quote

Ordered list

  1. Item 1
  2. Item 2
  3. Item 3

Unordered list

  • Item A
  • Item B
  • Item C

Text link

Bold text

Emphasis

Superscript

Subscript

No items found.
No items found.

Related articles