All skills
mapbox avatar

/mapbox-cartography

@7cac917 official
by mapboxmapbox/mapbox-agent-skills80 stars
17

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.

Use this Skill: https://skilld.dev/gh/mapbox/mapbox-agent-skills/mapbox-cartography

This session only. Nothing lands on disk.

referencesperformance-testing.md

≈328 tokens on demand. Your agent reads this file only when SKILL.md points to it.

Performance, Testing & Common Mistakes

Performance Optimization

Style Performance:

  • Minimize layer count (combine similar layers)
  • Use expressions instead of multiple layers for variants
  • Simplify complex geometries at lower zooms
  • Use sprite sheets for repeated icons
  • Leverage tileset simplification

Loading Speed:

  • Preload critical zoom levels
  • Use style optimization tools
  • Minimize external resource calls
  • Compress images in sprite sheets

Testing Your Design

Checklist:

  • View at all relevant zoom levels
  • Test in different lighting conditions
  • Check on actual devices (mobile, desktop)
  • Verify color accessibility (colorblind.org)
  • Review with target users
  • Test with real data density
  • Check label collision/overlap
  • Verify performance on slower devices

Common Mistakes to Avoid

  1. Too many colors: Stick to 5-7 main colors maximum
  2. Insufficient contrast: Text must be readable
  3. Overcrowding: Not everything needs a label
  4. Ignoring zoom levels: Show appropriate detail for scale
  5. Poor label hierarchy: Organize by importance
  6. Inconsistent styling: Maintain visual consistency
  7. Neglecting performance: Complex styles slow rendering
  8. Forgetting mobile: Test on actual devices

Source: SKILL.md on GitHub

No alerts17d5 checks · Risk SAFE
  • Gen Agent Trust Hub17d

    The skill contains cartographic design documentation and guidelines for Mapbox. No security vulnerabilities, malicious patterns, or executable code risks were detected.

  • Socket17d

    No alerts

  • Snyk17d

    Risk: LOW · No issues

  • Runlayer6mo

    2 files scanned · No issues

  • ZeroLeaks5mo

    Score: 93/100 · 2 sections analyzed

Signed by skilld at 7cac917. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub 9 hours ago.

Activeupdated 6 months ago
  • mapbox
  • cartography
  • map-design
  • color-theory
  • typography
  • visual-hierarchy
  • accessibility
  • dark-mode

README badge

README badge for mapbox/mapbox-agent-skills/mapbox-cartography

Provides cartographic guidance for designing map styles with Mapbox, covering visual hierarchy, color theory, typography, and zoom-level strategies. Use when choosing colors, establishing layer ordering, ensuring accessibility, or optimizing for specific use cases like navigation or data visualization.

Generated from the current SKILL.md.

Does this skill help with Mapbox GL JS implementation details?
No. This skill focuses on cartographic design principles, color theory, and visual hierarchy for maps. For Mapbox GL JS API usage, styling layer syntax, or performance tuning, refer to the Mapbox documentation or other technical skills.
What color palettes does this skill provide?
The skill includes four ready-to-use palettes: light theme, dark theme, high contrast for accessibility, and vintage/retro. Each specifies colors for background, water, parks, roads, buildings, and text.
Does this skill address mobile map design?
Yes. The skill covers platform-specific considerations including mobile touch targets (44x44px minimum), simpler designs for mobile, and larger text for arm's-length readability.
How does this skill recommend handling POIs and user content in layer ordering?
User-generated content like routes and markers should render above everything, including POI symbols, to ensure user data is never obscured by base map elements.
Does this skill provide guidance for colorblind accessibility?
Yes. The skill recommends a 4.5:1 contrast ratio for text, avoiding red/green combinations for critical distinctions, and testing designs with colorblind simulators.

Generated from the current SKILL.md. These answers refresh after source changes.