mapbox-cartography
Expert guidance on map design principles, color theory, visual hierarchy, typography, and cartographic best practices for creating effective and beautiful maps with Mapbox. Use when designing map styles, choosing colors, or making cartographic decisions.
Security Assessment
About mapbox-cartography
mapbox-cartography is an expert-guidance skill for designing effective, beautiful, and functional maps with Mapbox. It concentrates cartographic craft — visual hierarchy, color theory, typography, and best practices — into actionable rules so map styles read clearly and guide the viewer's attention to what matters, rather than looking cluttered or inconsistent.
The skill teaches how to build visual hierarchy (primary POIs and routes versus secondary roads and labels versus tertiary and background layers) using size, contrast, and color intensity. It covers color harmony (analogous, complementary, monochromatic), color psychology for map features, and accessibility (4.5:1 WCAG AA text contrast, not relying on color alone, colorblind testing, avoiding red/green for critical distinctions). It ships ready-to-use JSON color-palette templates for light, dark, high-contrast, and vintage themes, along with pointed rules such as keeping dark-theme roads a neutral gray so colored base roads don't compete with app data layers, and avoiding the 'floating labels' problem where street names sit over invisible roads. It also addresses typography at map scale and lists common mistakes like neglecting performance and mobile testing.
It targets designers, developers, and GIS practitioners building map styles with Mapbox who want principled cartographic decisions rather than ad-hoc color picking. It is pure design guidance with example style JSON and no code execution or credential handling, making it a benign reference.
FAQ
How do I decide what stands out on a map?
Establish a visual hierarchy: primary features (POIs, user location, route highlights) get high contrast, larger symbols, and bold colors, while background features (water, land use, terrain) stay muted, low-contrast, and smaller.
Does it help with accessible color choices?
Yes. It recommends a 4.5:1 contrast ratio for text (WCAG AA), not relying on color alone, testing with colorblind simulators, and avoiding red/green combinations for critical distinctions.
Are there ready-made palettes?
Yes. It provides JSON color-palette templates for light/day, dark/night, high-contrast accessibility, and vintage/retro themes, with specified colors for background, water, parks, roads, buildings, and text.
Why does it warn against colored roads in dark themes?
Roads should be a neutral dark gray, distinct from the background but not colored, so colored base roads don't compete with app data layers like routes and markers; roads that blend into the background create a floating-labels problem.
Who is this skill for?
Anyone designing Mapbox map styles or making cartographic decisions — designers, developers, and GIS practitioners — who want principled guidance on hierarchy, color, and typography.
Install mapbox-cartography
Quick Setup:
- Copy the skill folder to
.claude/skills/ - Claude will automatically detect and use the skill
Repository
mapbox/mapbox-agent-skills