Mapbox frontend tools for documentation websites.

Usage no npm install needed!

<script type="module">
  import mapboxDrUi from 'https://cdn.skypack.dev/@mapbox/dr-ui';



Build Status

Pronounced "Doctor UI". Documentation React UI components. See @mapbox/mr-ui.

UI components for Mapbox documentation projects.

This project is for internal Mapbox usage. The code is open source and we appreciate bug reports; but we will only consider feature requests and pull requests from Mapbox developers.



  • Node 14
  • npm 7

If you're not sure if your Node and NPM versions are up to date, run nvm use before installing dependencies. If you don't have NVM installed, you can find installation instructions here.

npm install @mapbox/dr-ui

On Mapbox projects, pair these components with version 0.26.0 of Mapbox's custom Assembly build. (This is not in peerDependencies because you might use <link> and <script> tags instead of the npm package.)

The public Assembly build should work fine, with maybe one or two hiccups.


Import individual components! All components are exposed at @mapbox/dr-ui/{component-name}. For example:

import Card from '@mapbox/dr-ui/card';
import BackToTopButton from '@mapbox/dr-ui/back-to-top-button';

Only the component itself and whatever it depends on will be drawn into your bundle.