From mapbox
Validates Mapbox style expressions and GeoJSON, checks color contrast for WCAG accessibility, optimizes file size by removing redundancies, and compares versions for production readiness and debugging.
npx claudepluginhub mapbox/mapbox-agent-skills --plugin mapboxThis skill uses the workspace's default tool permissions.
This skill provides expert guidance on ensuring Mapbox style quality through validation, accessibility, and optimization tools.
Provides patterns for integrating Mapbox MCP DevKit Server into AI coding workflows for style/token management, GeoJSON/expression validation, accessibility checks, and docs access when building Mapbox apps.
Mandates invoking relevant skills via tools before any response in coding sessions. Covers access, priorities, and adaptations for Claude Code, Copilot CLI, Gemini CLI.
Share bugs, ideas, or general feedback.
This skill provides expert guidance on ensuring Mapbox style quality through validation, accessibility, and optimization tools.
Before deploying any Mapbox style to production:
["all", expr] → expr, ["any", false, expr] → expr)When adding GeoJSON data:
validate_geojson_tool before using as a sourceWhen writing expressions:
validate_expression_tool as you write themWhen styling text/labels:
check_color_contrast_toolCompare style versions:
compare_styles_tool to generate a diff reportOptimize the style:
optimize_style_tool to reduce file size["all", expr] to expr, remove tautological conditions)Always validate when:
Common GeoJSON errors:
Example workflow:
1. Receive GeoJSON data
2. Validate with validate_geojson_tool
3. If valid: Add as source to style
4. If invalid: Fix errors, re-validate
Validate expressions for:
filter property on layers)paint and layout properties)Common expression errors:
Prevention strategies:
WCAG Levels:
Text size categories:
Common scenarios to check:
Testing strategy:
1. Validate expressions in style
2. Check color contrast for text layers
3. Optimize if needed
1. Validate all GeoJSON sources
2. Validate all expressions (filters, paint, layout)
3. Check color contrast for all text layers
4. Compare with previous production version
5. Optimize style
6. Test optimized style
7. Deploy
1. Compare working vs. broken style
2. Identify differences
3. Validate suspicious expressions
4. Check GeoJSON data if source-related
5. Verify color contrast if visibility issue
Problem: Map throws expression errors at runtime
Solution: Validate expressions with validate_expression_tool during development
Prevention: Add expression validation to pre-commit hooks or CI/CD
Problem: Text labels are hard to read on map
Solution: Check contrast with check_color_contrast_tool, adjust colors to meet WCAG AA
Prevention: Test text on both light and dark backgrounds, check at different zoom levels
Problem: Style takes long to load or transfer
Solution: Run optimize_style_tool to remove redundancies and simplify
Prevention: Regularly optimize during development, remove unused sources immediately
Problem: GeoJSON source fails to load or render
Solution: Validate with validate_geojson_tool, fix coordinate issues, verify structure
Prevention: Validate all external GeoJSON before adding to style
Problem: Style changed but unsure what modified
Solution: Use compare_styles_tool to generate diff report
Prevention: Compare before/after for all significant changes, document modifications
| Tool | Use When | Output |
|---|---|---|
validate_geojson_tool | Adding GeoJSON sources | Valid/invalid + error list |
validate_expression_tool | Writing expressions | Valid/invalid + error list |
check_color_contrast_tool | Styling text labels | Passes/fails + WCAG levels |
compare_styles_tool | Reviewing changes | Diff report with paths |
optimize_style_tool | Before deployment | Optimized style + savings |
For detailed guidance on specific topics, load the relevant reference:
references/optimization.md — Optimization types, strategies, recommended order, and maintenance best practicesreferences/comparison.md — Style comparison workflows, ignoreMetadata usage, and refactoring workflowreferences/ci-integration.md — Git pre-commit hooks, CI/CD pipeline steps, and code review checklistLoad instruction: Read the reference file when the user needs in-depth guidance on that topic.