diff --git a/__tests__/components/viewers/__snapshots__/nearby-view.js.snap b/__tests__/components/viewers/__snapshots__/nearby-view.js.snap
index bca73d951..10332856d 100644
--- a/__tests__/components/viewers/__snapshots__/nearby-view.js.snap
+++ b/__tests__/components/viewers/__snapshots__/nearby-view.js.snap
@@ -4917,7 +4917,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "79 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={24}
+                                            />,
                                           }
                                         }
                                       >
@@ -5349,7 +5351,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "85 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={26}
+                                            />,
                                           }
                                         }
                                       >
@@ -5781,7 +5785,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "112 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={34}
+                                            />,
                                           }
                                         }
                                       >
@@ -11246,7 +11252,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                             id="components.NearbyView.distanceAway"
                                             values={
                                               Object {
-                                                "localizedDistanceString": "135 feet",
+                                                "localizedDistanceString": <Memo(Connect(Distance))
+                                                  meters={41}
+                                                />,
                                               }
                                             }
                                           >
@@ -18583,7 +18591,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                             id="components.NearbyView.distanceAway"
                                             values={
                                               Object {
-                                                "localizedDistanceString": "161 feet",
+                                                "localizedDistanceString": <Memo(Connect(Distance))
+                                                  meters={49}
+                                                />,
                                               }
                                             }
                                           >
@@ -21824,7 +21834,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "171 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={52}
+                                            />,
                                           }
                                         }
                                       >
@@ -22256,7 +22268,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "187 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={57}
+                                            />,
                                           }
                                         }
                                       >
@@ -22688,7 +22702,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "187 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={57}
+                                            />,
                                           }
                                         }
                                       >
@@ -28846,7 +28862,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                             id="components.NearbyView.distanceAway"
                                             values={
                                               Object {
-                                                "localizedDistanceString": "302 feet",
+                                                "localizedDistanceString": <Memo(Connect(Distance))
+                                                  meters={92}
+                                                />,
                                               }
                                             }
                                           >
@@ -33522,7 +33540,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "377 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={115}
+                                            />,
                                           }
                                         }
                                       >
@@ -33954,7 +33974,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "387 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={118}
+                                            />,
                                           }
                                         }
                                       >
@@ -34386,7 +34408,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "397 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={121}
+                                            />,
                                           }
                                         }
                                       >
@@ -34818,7 +34842,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "469 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={143}
+                                            />,
                                           }
                                         }
                                       >
@@ -35250,7 +35276,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "495 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={151}
+                                            />,
                                           }
                                         }
                                       >
@@ -38906,7 +38934,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                             id="components.NearbyView.distanceAway"
                                             values={
                                               Object {
-                                                "localizedDistanceString": "502 feet",
+                                                "localizedDistanceString": <Memo(Connect(Distance))
+                                                  meters={153}
+                                                />,
                                               }
                                             }
                                           >
@@ -42171,7 +42201,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "512 feet",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={156}
+                                            />,
                                           }
                                         }
                                       >
@@ -47402,7 +47434,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                             id="components.NearbyView.distanceAway"
                                             values={
                                               Object {
-                                                "localizedDistanceString": "512 feet",
+                                                "localizedDistanceString": <Memo(Connect(Distance))
+                                                  meters={156}
+                                                />,
                                               }
                                             }
                                           >
@@ -55667,7 +55701,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                             id="components.NearbyView.distanceAway"
                                             values={
                                               Object {
-                                                "localizedDistanceString": "0.1 miles",
+                                                "localizedDistanceString": <Memo(Connect(Distance))
+                                                  meters={178}
+                                                />,
                                               }
                                             }
                                           >
@@ -62114,7 +62150,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                         id="components.NearbyView.distanceAway"
                                         values={
                                           Object {
-                                            "localizedDistanceString": "0.1 miles",
+                                            "localizedDistanceString": <Memo(Connect(Distance))
+                                              meters={181}
+                                            />,
                                           }
                                         }
                                       >
@@ -67579,7 +67617,9 @@ exports[`components > viewers > nearby view renders proper scooter dates 1`] = `
                                             id="components.NearbyView.distanceAway"
                                             values={
                                               Object {
-                                                "localizedDistanceString": "0.1 miles",
+                                                "localizedDistanceString": <Memo(Connect(Distance))
+                                                  meters={194}
+                                                />,
                                               }
                                             }
                                           >
diff --git a/example/example-config.yml b/example/example-config.yml
index 04651d8c2..782d37f22 100644
--- a/example/example-config.yml
+++ b/example/example-config.yml
@@ -18,6 +18,9 @@ api:
   port: 8080
   v2: true
 
+### The default unit system was historically imperial, but it can now easily be switched to metric:
+# units: metric
+
 # Determines if the header brand should be clickable or not. If set to true, 
 # clicking the header brand will go back to the main trip planner page and wipe out any
 # results.
diff --git a/lib/components/util/distance.ts b/lib/components/util/distance.ts
new file mode 100644
index 000000000..37c9ef1f5
--- /dev/null
+++ b/lib/components/util/distance.ts
@@ -0,0 +1,18 @@
+import { connect } from 'react-redux'
+import { Distance } from '@opentripplanner/humanize-distance'
+
+import { AppReduxState } from '../../util/state-types'
+
+// Connect to the redux store for unit system presets
+// (fall back to imperial to not break existing implementations).
+const mapStateToProps = (state: AppReduxState) => {
+  const { units = 'imperial' } = state.otp.config
+  return {
+    // Preset for long units to be consistent with humanizeDistanceString.
+    long: units === 'imperial',
+    units
+  }
+}
+
+// Pass an empty object as mapDispatchToProps to remove dispatch from the rendered HTML.
+export default connect(mapStateToProps, {})(Distance)
diff --git a/lib/components/viewers/nearby/distance-display.tsx b/lib/components/viewers/nearby/distance-display.tsx
index 373e04535..847050cb8 100644
--- a/lib/components/viewers/nearby/distance-display.tsx
+++ b/lib/components/viewers/nearby/distance-display.tsx
@@ -1,19 +1,18 @@
-import { FormattedMessage, useIntl } from 'react-intl'
-import { humanizeDistanceString } from '@opentripplanner/humanize-distance'
+import { FormattedMessage } from 'react-intl'
 import React from 'react'
 
+import Distance from '../../util/distance'
+
 import { CardAside } from './styled'
 
 const DistanceDisplay = ({ distance }: { distance?: number }): JSX.Element => {
-  const intl = useIntl()
-
   if (!distance || distance < 5) return <></>
   return (
     <CardAside>
       <FormattedMessage
         id="components.NearbyView.distanceAway"
         values={{
-          localizedDistanceString: humanizeDistanceString(distance, false, intl)
+          localizedDistanceString: <Distance meters={distance} />
         }}
       />
     </CardAside>
diff --git a/lib/util/config-types.ts b/lib/util/config-types.ts
index 05acffd68..019a436dd 100644
--- a/lib/util/config-types.ts
+++ b/lib/util/config-types.ts
@@ -10,6 +10,7 @@ import {
   ModeSetting,
   ModeSettingValues,
   TransitOperator,
+  UnitSystem,
   VehicleRentalMapOverlaySymbol
 } from '@opentripplanner/types'
 import { ControlPosition } from 'react-map-gl/maplibre'
@@ -441,6 +442,7 @@ export interface AppConfig {
   title?: string
   transitOperators?: TransitOperatorConfig[]
   translateExternalLinks?: boolean
+  units?: UnitSystem
 
   // Add other config items as needed.
 }