diff --git a/app/src/components/layout/CenterCanvas.svelte b/app/src/components/layout/CenterCanvas.svelte
index 7a05bb5..a7a1353 100644
--- a/app/src/components/layout/CenterCanvas.svelte
+++ b/app/src/components/layout/CenterCanvas.svelte
@@ -209,6 +209,7 @@
     const _hasActivity = app.hasActivity
     void app.gpxFilename // reactive dep: re-run when GPX changes
     void app.units // reactive dep: the unit-system preference flips readouts
+    void app.compactUnits // reactive dep: the km/h↔kmh style flips readouts
     void previewW // reactive dep: re-render when the base target size changes
     void previewH // (export resolution, preview box size, or display pixel ratio)
 
diff --git a/app/src/components/overlays/Settings.svelte b/app/src/components/overlays/Settings.svelte
index 3483274..3b98ccc 100644
--- a/app/src/components/overlays/Settings.svelte
+++ b/app/src/components/overlays/Settings.svelte
@@ -73,6 +73,17 @@
           ]}
           onchange={(v) => (app.units = v)}
         />
+        <p class="text-[11px] text-zinc-500">
+          Speed unit style — how compound speed units are written.
+        </p>
+        <Select
+          value={app.compactUnits ? 'compact' : 'slash'}
+          options={[
+            { value: 'slash', label: 'km/h' },
+            { value: 'compact', label: 'kmh' },
+          ]}
+          onchange={(v) => (app.compactUnits = v === 'compact')}
+        />
       </div>
 
       <!-- Rider weight — powers the W/kg metric. Stored on this device only and
diff --git a/app/src/components/panels/ElementProperties.svelte b/app/src/components/panels/ElementProperties.svelte
index 015ee19..3f92dfd 100644
--- a/app/src/components/panels/ElementProperties.svelte
+++ b/app/src/components/panels/ElementProperties.svelte
@@ -123,6 +123,17 @@
   const metricLabel = (m) => METRIC_LABELS[m] ?? (isCustomMetric(m) ? customMetricLabel(m) : m)
   const ALL_PLOT_METRICS = ['elevation', 'speed', 'heartrate', 'power', 'cadence', 'gradient', 'temperature', 'front_gear', 'rear_gear', 'course', 'distance']
   const ALL_METER_METRICS = ['speed', 'heartrate', 'power', 'power_to_weight', 'elevation', 'cadence', 'gradient', 'temperature', 'front_gear', 'rear_gear']
+  // Metrics a label can represent the *unit* of (those with a metric/imperial
+  // distinction, mirroring units::has_unit_system on the Rust side). Picking one
+  // makes the label render that unit (e.g. "mph"/"km/h") and track the settings
+  // toggle, instead of frozen static text.
+  const UNIT_OF_OPTIONS = [
+    { value: '', label: 'Off (static text)' },
+    { value: 'speed', label: 'Speed (mph / km/h)' },
+    { value: 'distance', label: 'Distance (mi / km)' },
+    { value: 'elevation', label: 'Elevation (ft / m)' },
+    { value: 'temperature', label: 'Temperature (°F / °C)' },
+  ]
 
   function filterMetrics(list) {
     const valid = app.activityMetrics
@@ -376,6 +387,19 @@
   function effectiveUnit(metric, unit) {
     return unit == null ? sceneUnit(metric) : displayUnit(metric, unit)
   }
+  // Human unit label for a `unit_of` label under the active setting, mirroring
+  // units::unit_label on the Rust side. Used only for the editor hint; the
+  // rendered text is resolved in Rust.
+  function effectiveUnitLabel(metric) {
+    const imperial = sceneUnitSystem() === 'imperial'
+    const label = {
+      speed: imperial ? 'mph' : 'km/h',
+      distance: imperial ? 'mi' : 'km',
+      elevation: imperial ? 'ft' : 'm',
+      temperature: imperial ? '°F' : '°C',
+    }[metric] ?? ''
+    return app.compactUnits ? label.replace('/', '') : label
+  }
   // Value shown in a unit picker: '' = Auto (inherit scene), else the concrete
   // token (legacy metric/imperial map onto their precise option).
   function unitValue(metric, unit) {
@@ -1114,7 +1138,18 @@ Looks unrealistic for ${item.value} (expected ${issue.expected}). Enter a manual
       <!-- Text: all text properties in one place -->
       <section class="mb-4 space-y-2">
         <p class="text-[10px] uppercase tracking-wider text-zinc-600">Text</p>
-        <Input value={item.text ?? ''} oninput={(e) => update('text', e.target.value)} />
+        {#if item.unit_of}
+          <p class="text-[11px] leading-relaxed text-zinc-500">
+            Shows the {UNIT_OF_OPTIONS.find((o) => o.value === item.unit_of)?.label.split(' ')[0].toLowerCase() ?? item.unit_of} unit
+            (e.g. {effectiveUnitLabel(item.unit_of)}) and follows your unit setting.
+          </p>
+        {:else}
+          <Input value={item.text ?? ''} oninput={(e) => update('text', e.target.value)} />
+        {/if}
+        <label class="space-y-1 block">
+          <span class="text-xs text-zinc-500">Unit label</span>
+          <Select value={item.unit_of ?? ''} options={UNIT_OF_OPTIONS} onchange={(v) => update('unit_of', v || undefined)} />
+        </label>
         <label class="space-y-1 block">
           <span class="text-xs text-zinc-500">Font</span>
           <Select value={item.font ?? ''} options={fontOpts(true)} onchange={(v) => update('font', v || undefined)} />
diff --git a/app/src/lib/elementTypes.js b/app/src/lib/elementTypes.js
index 57e7189..3a4fd23 100644
--- a/app/src/lib/elementTypes.js
+++ b/app/src/lib/elementTypes.js
@@ -506,7 +506,13 @@ export const ADD_PRESETS = [
 export function elementMeta(el) {
   if (!el) return { icon: 'bar', name: '', kind: 'plot', unit: null }
   if (el.type === 'label')
-    return { icon: 'type', name: el.text || 'Label', kind: 'label', unit: null }
+    return {
+      icon: 'type',
+      // Unit labels have no static text; name them after the metric they track.
+      name: el.unit_of ? `${el.unit_of} unit` : el.text || 'Label',
+      kind: 'label',
+      unit: null,
+    }
   if (el.type === 'value')
     return {
       icon: 'hash',
diff --git a/app/src/state/appState.svelte.js b/app/src/state/appState.svelte.js
index 85e68e1..9a78241 100644
--- a/app/src/state/appState.svelte.js
+++ b/app/src/state/appState.svelte.js
@@ -124,6 +124,13 @@ export function createAppState() {
     localStorage.getItem('units') ??
       (_persisted?.scene?.units === 'imperial' ? 'imperial' : 'metric'),
   )
+  // Compound-unit style for compound speed units: false → "km/h" (default),
+  // true → "kmh". App-level like `units`: stored on this device, injected into
+  // scene.compact_units at render, never saved into the template.
+  let compactUnits = $state(
+    (localStorage.getItem('compactUnits') ??
+      String(_persisted?.scene?.compact_units === true)) === 'true',
+  )
   let outputDir = $state(localStorage.getItem('outputDir') ?? null)
   let defaultOutputDir = $state(null)
   let outputWidth = $state(
@@ -236,6 +243,9 @@ export function createAppState() {
   $effect(() => {
     localStorage.setItem('units', units)
   })
+  $effect(() => {
+    localStorage.setItem('compactUnits', String(compactUnits))
+  })
   $effect(() => {
     localStorage.setItem('outputWidth', String(outputWidth))
   })
@@ -643,7 +653,9 @@ export function createAppState() {
   // to every element left on Auto; rider weight rides as a separate render
   // argument (riderWeightKg).
   function withAppSettings(cfg) {
-    return cfg ? { ...cfg, scene: { ...cfg.scene, units } } : cfg
+    return cfg
+      ? { ...cfg, scene: { ...cfg.scene, units, compact_units: compactUnits } }
+      : cfg
   }
 
   function updateScene(updates) {
@@ -840,11 +852,16 @@ export function createAppState() {
       return base
     })
 
-    // units moved to an app-level preference (see `units` state) — strip the
-    // legacy scene field so it never rides in saved templates again.
+    // units and compact_units moved to app-level preferences (see `units` /
+    // `compactUnits` state) — strip the scene fields so they never ride in
+    // saved templates again.
     const sceneBase = Object.fromEntries(
       Object.entries(config.scene ?? {}).filter(
-        ([k]) => k !== 'editor' && k !== 'groups' && k !== 'units',
+        ([k]) =>
+          k !== 'editor' &&
+          k !== 'groups' &&
+          k !== 'units' &&
+          k !== 'compact_units',
       ),
     )
     return { ...config, scene: { ...sceneBase, groups }, elements }
@@ -1489,6 +1506,14 @@ export function createAppState() {
     set units(v) {
       units = v === 'imperial' ? 'imperial' : 'metric'
     },
+    // Compact compound-unit style ("km/h" vs "kmh"); app-level, injected into
+    // scene.compact_units, never saved to templates.
+    get compactUnits() {
+      return compactUnits
+    },
+    set compactUnits(v) {
+      compactUnits = v === true || v === 'true' || v === 'compact'
+    },
     // Config with app-level settings (unit system) injected — what every
     // render/preview call sends; template saves keep using `config`.
     get renderConfig() {
diff --git a/src-tauri/render-core/src/activity.rs b/src-tauri/render-core/src/activity.rs
index e88d07f..d5bd970 100644
--- a/src-tauri/render-core/src/activity.rs
+++ b/src-tauri/render-core/src/activity.rs
@@ -2149,6 +2149,7 @@ mod tests {
             groups: Vec::new(),
             vars: std::collections::HashMap::new(),
             units: None,
+            compact_units: None,
         }
     }
 
diff --git a/src-tauri/render-core/src/chart.rs b/src-tauri/render-core/src/chart.rs
index 3562732..cb35982 100644
--- a/src-tauri/render-core/src/chart.rs
+++ b/src-tauri/render-core/src/chart.rs
@@ -604,9 +604,10 @@ impl ChartCache {
                 // Pre-format all lines and find max width to decide which side
                 // to place the label block. Near the right edge the block flips
                 // left so it never overflows the chart surface.
+                let compact = pl.compact_units.unwrap_or(false);
                 let lines: Vec<String> = units
                     .iter()
-                    .map(|unit| format_point_label(raw, &self.value_attr, unit, dec))
+                    .map(|unit| format_point_label(raw, &self.value_attr, unit, dec, compact))
                     .collect();
                 let max_text_w = lines
                     .iter()
@@ -637,9 +638,13 @@ impl ChartCache {
 /// Format a plotted value for a point label in the requested unit system,
 /// producing "<number> <SUFFIX>" (e.g. "960 M", "3150 FT"). `raw` is the
 /// attribute's native unit (elevation: metres, speed: m/s, temp: °C).
-fn format_point_label(raw: f64, attr: &str, unit: &str, decimals: i32) -> String {
+fn format_point_label(raw: f64, attr: &str, unit: &str, decimals: i32, compact: bool) -> String {
     let (conv, suffix) = units::resolve(attr, Some(unit));
-    format!("{} {}", round_str(conv.apply(raw), decimals), suffix)
+    format!(
+        "{} {}",
+        round_str(conv.apply(raw), decimals),
+        units::compact_unit(&suffix, compact)
+    )
 }
 
 fn round_str(v: f64, decimals: i32) -> String {
@@ -1112,42 +1117,88 @@ mod tests {
     #[test]
     fn elevation_metric_and_imperial_match_screenshot_format() {
         // 960 m -> "960 M"; 960 * 3.28084 = 3149.6 -> "3150 FT"
-        assert_eq!(format_point_label(960.0, "elevation", "metric", 0), "960 M");
         assert_eq!(
-            format_point_label(960.0, "elevation", "imperial", 0),
+            format_point_label(960.0, "elevation", "metric", 0, false),
+            "960 M"
+        );
+        assert_eq!(
+            format_point_label(960.0, "elevation", "imperial", 0, false),
             "3150 FT"
         );
     }
 
     #[test]
     fn speed_temperature_and_decimals() {
-        assert_eq!(format_point_label(10.0, "speed", "metric", 0), "36 KM/H");
-        assert_eq!(format_point_label(10.0, "speed", "imperial", 0), "22 MPH");
         assert_eq!(
-            format_point_label(0.0, "temperature", "imperial", 0),
+            format_point_label(10.0, "speed", "metric", 0, false),
+            "36 KM/H"
+        );
+        assert_eq!(
+            format_point_label(10.0, "speed", "imperial", 0, false),
+            "22 MPH"
+        );
+        assert_eq!(
+            format_point_label(0.0, "temperature", "imperial", 0, false),
             "32 F"
         );
         assert_eq!(
-            format_point_label(959.74, "elevation", "metric", 1),
+            format_point_label(959.74, "elevation", "metric", 1, false),
             "959.7 M"
         );
     }
 
     #[test]
     fn unknown_attribute_echoes_unit_uppercased() {
-        assert_eq!(format_point_label(5.0, "power", "watts", 0), "5 WATTS");
+        assert_eq!(
+            format_point_label(5.0, "power", "watts", 0, false),
+            "5 WATTS"
+        );
     }
 
     #[test]
     fn precise_unit_tokens() {
-        assert_eq!(format_point_label(10.0, "speed", "kmh", 0), "36 KM/H");
-        assert_eq!(format_point_label(10.0, "speed", "mph", 0), "22 MPH");
-        assert_eq!(format_point_label(10.0, "speed", "ms", 0), "10 M/S");
-        assert_eq!(format_point_label(5000.0, "distance", "km", 0), "5 KM");
-        assert_eq!(format_point_label(5000.0, "distance", "m", 0), "5000 M");
-        assert_eq!(format_point_label(1609.34, "distance", "mi", 0), "1 MI");
-        assert_eq!(format_point_label(960.0, "elevation", "ft", 0), "3150 FT");
-        assert_eq!(format_point_label(0.0, "temperature", "f", 0), "32 F");
-        assert_eq!(format_point_label(20.0, "temperature", "c", 0), "20 C");
+        assert_eq!(
+            format_point_label(10.0, "speed", "kmh", 0, false),
+            "36 KM/H"
+        );
+        assert_eq!(format_point_label(10.0, "speed", "mph", 0, false), "22 MPH");
+        assert_eq!(format_point_label(10.0, "speed", "ms", 0, false), "10 M/S");
+        assert_eq!(
+            format_point_label(5000.0, "distance", "km", 0, false),
+            "5 KM"
+        );
+        assert_eq!(
+            format_point_label(5000.0, "distance", "m", 0, false),
+            "5000 M"
+        );
+        assert_eq!(
+            format_point_label(1609.34, "distance", "mi", 0, false),
+            "1 MI"
+        );
+        assert_eq!(
+            format_point_label(960.0, "elevation", "ft", 0, false),
+            "3150 FT"
+        );
+        assert_eq!(
+            format_point_label(0.0, "temperature", "f", 0, false),
+            "32 F"
+        );
+        assert_eq!(
+            format_point_label(20.0, "temperature", "c", 0, false),
+            "20 C"
+        );
+    }
+
+    /// Compact style drops the "/" in compound speed units for chart point
+    /// labels too; non-compound units are unaffected.
+    #[test]
+    fn compact_units_drop_the_slash() {
+        assert_eq!(format_point_label(10.0, "speed", "kmh", 0, true), "36 KMH");
+        assert_eq!(format_point_label(10.0, "speed", "ms", 0, true), "10 MS");
+        assert_eq!(format_point_label(10.0, "speed", "mph", 0, true), "22 MPH");
+        assert_eq!(
+            format_point_label(5000.0, "distance", "km", 0, true),
+            "5 KM"
+        );
     }
 }
diff --git a/src-tauri/render-core/src/frame.rs b/src-tauri/render-core/src/frame.rs
index b6cc506..7c5e444 100644
--- a/src-tauri/render-core/src/frame.rs
+++ b/src-tauri/render-core/src/frame.rs
@@ -1893,6 +1893,7 @@ fn resolve_suffix(cfg: &ValueConfig) -> Option<String> {
         Some("auto") => {
             let unit_attr = unit_base_metric(&cfg.value);
             units::display_suffix(unit_attr, cfg.unit.as_deref())
+                .map(|s| units::compact_unit(&s, cfg.compact_units.unwrap_or(false)))
         }
         _ => cfg.suffix.clone().filter(|s| !s.is_empty()),
     }
diff --git a/src-tauri/render-core/src/template.rs b/src-tauri/render-core/src/template.rs
index 40691f0..a9e8f43 100644
--- a/src-tauri/render-core/src/template.rs
+++ b/src-tauri/render-core/src/template.rs
@@ -58,6 +58,12 @@ pub struct SceneConfig {
     /// single toggle flips every unit-bearing readout. Elements with an explicit
     /// unit override the scene system.
     pub units: Option<String>,
+    /// App-wide compound-unit style: when `true`, drop the `/` separator so
+    /// compound speed units render compactly (`"km/h"`→`"kmh"`, `"m/s"`→`"ms"`);
+    /// units without a separator are unaffected. Injected from the editor's
+    /// Settings like `units`; a pre-pass (`Template::apply_compact_units`) fans
+    /// it out to value/plot readouts, and unit labels read it directly.
+    pub compact_units: Option<bool>,
     /// Rider weight in kg, used only to compute the `power_to_weight` (W/kg)
     /// metric at render time. `#[serde(skip)]` is deliberate and load-bearing:
     /// weight is sensitive personal data, so it must never be serialized into a
@@ -319,6 +325,9 @@ fn scale_anchor(anchor: &mut Option<AnchorConfig>, factor: f32) {
 #[derive(Debug, Clone, Serialize, Deserialize)]
 pub struct LabelConfig {
     pub id: String,
+    /// Defaults to empty so a `unit_of` label can omit static text —
+    /// `apply_unit_labels` fills it from the active unit system at load.
+    #[serde(default)]
     pub text: String,
     pub x: i32,
     pub y: i32,
@@ -336,6 +345,17 @@ pub struct LabelConfig {
     /// "middle" | "bottom". "middle" centers on cap height, which optically
     /// centers digits and stays stable as the text changes per frame.
     pub vertical_align: Option<String>,
+    /// When set to a metric attribute (`"speed"`, `"distance"`, `"elevation"`,
+    /// `"temperature"`), the label renders that metric's unit label under the
+    /// active unit system (e.g. "mph"→"km/h" when the scene flips to metric)
+    /// instead of `text`. `Template::apply_unit_labels` overwrites `text` from
+    /// this at load, so a standalone "mph"/"mi" caption tracks the settings
+    /// toggle rather than being frozen static text.
+    pub unit_of: Option<String>,
+    /// Explicit unit override for a `unit_of` label. Left unset, the label
+    /// follows `scene.units` (filled by `apply_scene_units`), matching the Auto
+    /// behaviour of value/meter/gauge elements.
+    pub unit: Option<String>,
     pub anchor: Option<AnchorConfig>,
 }
 
@@ -351,6 +371,9 @@ pub struct ValueConfig {
     pub color: Option<String>,
     pub opacity: Option<f32>,
     pub unit: Option<String>,
+    /// Compound-unit style for an "auto" suffix, filled from `scene.compact_units`
+    /// by `apply_compact_units` (see [`SceneConfig::compact_units`]).
+    pub compact_units: Option<bool>,
     /// Manual suffix text, used when `suffix_mode` is "custom" (or absent, for
     /// back-compat with templates authored before `suffix_mode` existed).
     pub suffix: Option<String>,
@@ -566,6 +589,9 @@ pub struct PointLabelConfig {
     pub x_offset: Option<f32>,
     pub y_offset: Option<f32>,
     pub units: Option<Vec<String>>,
+    /// Compound-unit style, filled from `scene.compact_units` by
+    /// `apply_compact_units` (see [`SceneConfig::compact_units`]).
+    pub compact_units: Option<bool>,
     pub decimal_rounding: Option<i32>,
 }
 
@@ -877,6 +903,8 @@ impl Template {
         }
 
         template.apply_scene_units();
+        template.apply_compact_units();
+        template.apply_unit_labels();
         template.resolve_anchors();
         Ok(template)
     }
@@ -896,6 +924,11 @@ impl Template {
                 Element::Value(c) => fill_scene_unit(&c.value, &mut c.unit, system),
                 Element::Meter(c) => fill_scene_unit(&c.value, &mut c.unit, system),
                 Element::Gauge(c) => fill_scene_unit(&c.value, &mut c.unit, system),
+                Element::Label(c) => {
+                    if let Some(metric) = &c.unit_of {
+                        fill_scene_unit(metric, &mut c.unit, system)
+                    }
+                }
                 Element::Plot(c) => {
                     if let Some(pl) = &mut c.point_label
                         && pl.units.is_none()
@@ -909,6 +942,47 @@ impl Template {
         }
     }
 
+    /// Fill the app-wide compound-unit style (`scene.compact_units`) into every
+    /// value readout and plot point label that hasn't set its own, so one toggle
+    /// flips "km/h"→"kmh" everywhere. Only "compact" needs filling; the default
+    /// (slash form) is `compact_unit`'s default already. Unit *labels* read the
+    /// scene flag directly in `apply_unit_labels`, so they aren't stamped here.
+    fn apply_compact_units(&mut self) {
+        if !self.scene.compact_units.unwrap_or(false) {
+            return;
+        }
+        for el in &mut self.elements {
+            match el {
+                Element::Value(c) => c.compact_units.get_or_insert(true),
+                Element::Plot(c) => match &mut c.point_label {
+                    Some(pl) => pl.compact_units.get_or_insert(true),
+                    None => continue,
+                },
+                _ => continue,
+            };
+        }
+    }
+
+    /// Resolve every unit-representing label (`label.unit_of`) into concrete
+    /// display text, so a standalone "mph"/"mi" caption tracks the unit system
+    /// instead of being frozen static text. Runs after `apply_scene_units` so
+    /// the label's `unit` reflects the scene toggle, and before `resolve_anchors`
+    /// so anchored siblings measure against the final text. A metric with no
+    /// natural unit label (time, gear) leaves the authored `text` untouched.
+    fn apply_unit_labels(&mut self) {
+        let compact = self.scene.compact_units.unwrap_or(false);
+        for el in &mut self.elements {
+            if let Element::Label(c) = el
+                && let Some(metric) = &c.unit_of
+            {
+                let base = crate::activity::unit_base_metric(metric);
+                if let Some(label) = crate::units::unit_label(base, c.unit.as_deref(), compact) {
+                    c.text = label;
+                }
+            }
+        }
+    }
+
     /// Rewrite the `x`/`y` of every anchored element from its target's box.
     /// Runs after scaling so all coordinates are in output space. Chains
     /// (rect anchored to a rect anchored to a gauge) resolve over multiple
@@ -1024,6 +1098,93 @@ fn merge_scene_into_item(scene: &serde_json::Value, item: &mut serde_json::Value
 mod tests {
     use super::*;
 
+    /// A `unit_of` label resolves to concrete unit text at load and follows
+    /// the scene unit system: metric default renders "km/h"/"km", and flipping
+    /// `scene.units` to imperial renders "mph"/"mi". Static-text labels and an
+    /// explicit per-label `unit` are left untouched.
+    #[test]
+    fn unit_of_labels_track_the_scene_unit_system() {
+        let template_json = |units: Option<&str>| {
+            let scene = match units {
+                Some(u) => serde_json::json!({ "width": 100, "height": 100, "units": u }),
+                None => serde_json::json!({ "width": 100, "height": 100 }),
+            };
+            serde_json::json!({
+                "scene": scene,
+                "elements": [
+                    { "type": "label", "id": "u-speed", "unit_of": "speed", "x": 0, "y": 0 },
+                    { "type": "label", "id": "u-dist", "unit_of": "distance", "x": 0, "y": 0 },
+                    // summary metric maps to its base (elevation)
+                    { "type": "label", "id": "u-gain", "unit_of": "running_elevation_gain", "x": 0, "y": 0 },
+                    // explicit unit overrides the scene system
+                    { "type": "label", "id": "u-fixed", "unit_of": "speed", "unit": "mph", "x": 0, "y": 0 },
+                    // plain static label is never rewritten
+                    { "type": "label", "id": "static", "text": "GO", "x": 0, "y": 0 }
+                ]
+            })
+        };
+        let text_of = |t: &Template, id: &str| -> String {
+            t.elements
+                .iter()
+                .find_map(|e| match e {
+                    Element::Label(c) if c.id == id => Some(c.text.clone()),
+                    _ => None,
+                })
+                .unwrap()
+        };
+
+        let metric = Template::from_value(template_json(None)).unwrap();
+        assert_eq!(text_of(&metric, "u-speed"), "km/h");
+        assert_eq!(text_of(&metric, "u-dist"), "km");
+        assert_eq!(text_of(&metric, "u-gain"), "m");
+        assert_eq!(text_of(&metric, "u-fixed"), "mph"); // explicit unit wins
+        assert_eq!(text_of(&metric, "static"), "GO"); // untouched
+
+        let imperial = Template::from_value(template_json(Some("imperial"))).unwrap();
+        assert_eq!(text_of(&imperial, "u-speed"), "mph");
+        assert_eq!(text_of(&imperial, "u-dist"), "mi");
+        assert_eq!(text_of(&imperial, "u-gain"), "ft");
+        assert_eq!(text_of(&imperial, "u-fixed"), "mph");
+        assert_eq!(text_of(&imperial, "static"), "GO");
+    }
+
+    /// `scene.compact_units` drops the "/" from compound speed units across
+    /// unit labels and value auto-suffixes; non-compound units are unaffected.
+    #[test]
+    fn compact_units_flip_compound_speed_units() {
+        let raw = serde_json::json!({
+            "scene": { "width": 100, "height": 100, "compact_units": true },
+            "elements": [
+                { "type": "label", "id": "u-speed", "unit_of": "speed", "x": 0, "y": 0 },
+                { "type": "label", "id": "u-dist", "unit_of": "distance", "x": 0, "y": 0 },
+                { "type": "value", "id": "v-speed", "value": "speed",
+                  "suffix_mode": "auto", "x": 0, "y": 0 },
+                { "type": "value", "id": "v-dist", "value": "distance",
+                  "suffix_mode": "auto", "x": 0, "y": 0 }
+            ]
+        });
+        let t = Template::from_value(raw).unwrap();
+        let label = |id: &str| {
+            t.elements
+                .iter()
+                .find_map(|e| match e {
+                    Element::Label(c) if c.id == id => Some(c.text.clone()),
+                    _ => None,
+                })
+                .unwrap()
+        };
+        // Labels: compound speed loses its slash, distance is untouched.
+        assert_eq!(label("u-speed"), "kmh");
+        assert_eq!(label("u-dist"), "km");
+        // Value auto-suffixes: the compact flag is stamped onto the value config
+        // so the suffix ("kmh") matches the label.
+        let v_speed = t.elements.iter().find_map(|e| match e {
+            Element::Value(c) if c.id == "v-speed" => Some(c),
+            _ => None,
+        });
+        assert_eq!(v_speed.unwrap().compact_units, Some(true));
+    }
+
     #[test]
     fn color_by_defaults_to_gradient_bands_sorted() {
         let cb: ColorByConfig = serde_json::from_value(serde_json::json!({})).unwrap();
diff --git a/src-tauri/render-core/src/units.rs b/src-tauri/render-core/src/units.rs
index b96a54c..b10f0b5 100644
--- a/src-tauri/render-core/src/units.rs
+++ b/src-tauri/render-core/src/units.rs
@@ -125,6 +125,31 @@ pub fn has_unit_system(attr: &str) -> bool {
     )
 }
 
+/// Render a unit string in the app's compound-unit style. With `compact` set,
+/// drop the `/` separator that only compound units carry (`"km/h"`→`"kmh"`,
+/// `"m/s"`→`"ms"`); every other unit (`"mph"`, `"mi"`, `"ft"`, `"%"`, `"W"`,
+/// `"°C"`, …) has no separator and passes through unchanged. Driven by the
+/// app-wide `scene.compact_units` preference.
+pub fn compact_unit(s: &str, compact: bool) -> String {
+    if compact {
+        s.replace('/', "")
+    } else {
+        s.to_string()
+    }
+}
+
+/// Standalone unit label for a metric under the active unit system, cased the
+/// way a rider reads it in an overlay and *without* the leading space
+/// [`display_suffix`] carries (`"mph"`, `"km/h"`, `"mi"`, `"ft"`, `"°C"`,
+/// `"%"`, `"W"`). `compact` applies the [`compact_unit`] style. Used by
+/// unit-representing labels (`label.unit_of`) so a standalone "mph"/"mi"
+/// caption tracks the settings toggle instead of being frozen static text.
+/// Returns `None` for metrics with no natural unit label (time, gear) — the
+/// caller leaves such a label's text untouched.
+pub fn unit_label(attr: &str, unit: Option<&str>, compact: bool) -> Option<String> {
+    display_suffix(attr, unit).map(|s| compact_unit(s.trim_start(), compact))
+}
+
 /// Convert a display-unit distance target back to metres (used by the
 /// "until_custom" distance-reference mode). Inverse of the distance branch of
 /// [`resolve`]; distance has no offset so this is a plain divide.
diff --git a/src-tauri/render-core/tests/bundled_templates.rs b/src-tauri/render-core/tests/bundled_templates.rs
new file mode 100644
index 0000000..4401ae3
--- /dev/null
+++ b/src-tauri/render-core/tests/bundled_templates.rs
@@ -0,0 +1,37 @@
+//! Every bundled template must survive the real deserializer. Templates are
+//! plain JSON with no compile-time checking, so a schema change in
+//! `template.rs` can silently break a shipped template until someone opens it
+//! in the app. This walks `templates/<name>/<name>.json` and parses each one
+//! the same way the app does.
+
+use render_core::template::Template;
+
+#[test]
+fn all_bundled_templates_parse() {
+    let dir = concat!(env!("CARGO_MANIFEST_DIR"), "/../../templates");
+    let mut parsed = 0;
+
+    for entry in std::fs::read_dir(dir).expect("templates dir") {
+        let path = entry.expect("dir entry").path();
+        if !path.is_dir() {
+            continue;
+        }
+        let name = path.file_name().unwrap().to_string_lossy().to_string();
+        let json = path.join(format!("{name}.json"));
+        if !json.exists() {
+            continue; // `_assets` and friends
+        }
+
+        let text = std::fs::read_to_string(&json).expect("readable template");
+        let raw: serde_json::Value =
+            serde_json::from_str(&text).unwrap_or_else(|e| panic!("{name}: not valid JSON: {e}"));
+        // Scale to 1080p on the way in, exercising the same path the app uses
+        // for a non-native output resolution.
+        Template::from_value_scaled(raw, Some((1920, 1080)))
+            .unwrap_or_else(|e| panic!("{name}: failed to deserialize: {e}"));
+
+        parsed += 1;
+    }
+
+    assert!(parsed > 0, "found no bundled templates to check");
+}
diff --git a/src-tauri/src/lib.rs b/src-tauri/src/lib.rs
index 8163a61..5a42b25 100644
--- a/src-tauri/src/lib.rs
+++ b/src-tauri/src/lib.rs
@@ -1551,6 +1551,7 @@ async fn backend_activity_distance_info(
         vars: std::collections::HashMap::new(),
         rider_weight_kg: None,
         units: None,
+        compact_units: None,
         lap_gate: None,
     };
     let activity = activity.sample_for_scene(&scene, synthetic)?;
@@ -1613,6 +1614,7 @@ async fn backend_activity_metric_range(
         vars: std::collections::HashMap::new(),
         rider_weight_kg: None,
         units: None,
+        compact_units: None,
         lap_gate: None,
     };
     let activity = activity.sample_for_scene(&scene, synthetic)?;
diff --git a/templates/README.md b/templates/README.md
index 5ba361c..1bdb45f 100644
--- a/templates/README.md
+++ b/templates/README.md
@@ -8,6 +8,7 @@ Community templates are browsable and installable directly from within Cyclemetr
 | --- | --- |
 | **Aaron** | ![Aaron](aaron/preview.jpg) |
 | **Crit** | ![Crit](crit/preview.jpg) |
+| **Enduro HUD** | ![Enduro HUD](enduro_hud/preview.jpg) |
 | **Jeff** | ![Jeff](jeff/preview.jpg) |
 | **NorCal** | ![NorCal](norcal/preview.jpg) |
 | **Safa** | ![Safa](safa/preview.jpg) |
diff --git a/templates/enduro_hud/README.md b/templates/enduro_hud/README.md
new file mode 100644
index 0000000..baf9e92
--- /dev/null
+++ b/templates/enduro_hud/README.md
@@ -0,0 +1,49 @@
+# Enduro HUD
+
+An instrument-panel overlay in the style of an enduro race HUD: translucent
+smoked-glass panels with hairline borders, corner registration ticks, and a
+single orange accent running through the whole layout.
+
+Reads clockwise from the top left — a course-progress bar with W/kg and
+altitude chips, GPS track trace, heart-rate dial with ride stats, elevation
+profile with a floating grade badge, and a large speed readout paired with
+cadence and a segmented power bar.
+
+Every readout is live: nothing on the overlay holds a whole-ride constant except
+the course total in the trace header, paired with the distance covered so far.
+
+## Design
+
+Adapted from an "Enduro HUD Overlay" concept designed for motorcycle
+chest-cam footage. The moto-specific readouts were remapped to their cycling
+equivalents:
+
+| Original | Here |
+| --- | --- |
+| Gear | Cadence |
+| RPM redline bar | Power (segmented, auto-scaled to the ride's max) |
+| Lean-angle dial | Heart-rate dial (60–200 bpm) |
+| G-force | W/kg |
+| Stage counter | Course-progress bar |
+
+## Notes
+
+- Authored at 4K (3840×2160) and scaled to the chosen output resolution.
+- Units follow the app's unit setting, not the template — the speed and
+  distance captions are `unit_of` labels, so they rewrite themselves
+  (`mph`→`km/h`, `mi`→`km`) when you flip between imperial and metric. The
+  `bpm` caption is static, since heart rate reads the same in both systems.
+- Best results with a file carrying heart rate, power, and cadence. Missing
+  metrics leave their panel blank rather than breaking the layout.
+- The **W/KG** chip needs a rider weight set in the app's settings — without one
+  it reads `0.0`. Swap that chip's metric if you'd rather not set a weight.
+- The progress bar in the top left is a `distance` meter spanning the ride
+  (`min`→`max`), so it fills left to right exactly once over the overlay window.
+- **GAIN** / **DROP** are `running_elevation_gain` / `running_elevation_loss`:
+  they count up as you climb and descend rather than showing the ride total.
+- Colors are driven by `scene.vars` — change `accent` to re-theme the entire
+  overlay in one edit.
+
+## Preview
+
+![Enduro HUD preview](preview.jpg)
diff --git a/templates/enduro_hud/enduro_hud.json b/templates/enduro_hud/enduro_hud.json
new file mode 100644
index 0000000..e6729c3
--- /dev/null
+++ b/templates/enduro_hud/enduro_hud.json
@@ -0,0 +1,909 @@
+{
+  "elements": [
+    {
+      "color": "#ffffff",
+      "height": 4,
+      "id": "tick-tl-h",
+      "opacity": 0.28,
+      "type": "rect",
+      "width": 52,
+      "x": 44,
+      "y": 44
+    },
+    {
+      "color": "#ffffff",
+      "height": 52,
+      "id": "tick-tl-v",
+      "opacity": 0.28,
+      "type": "rect",
+      "width": 4,
+      "x": 44,
+      "y": 44
+    },
+    {
+      "color": "#ffffff",
+      "height": 4,
+      "id": "tick-tr-h",
+      "opacity": 0.28,
+      "type": "rect",
+      "width": 52,
+      "x": 3744,
+      "y": 44
+    },
+    {
+      "color": "#ffffff",
+      "height": 52,
+      "id": "tick-tr-v",
+      "opacity": 0.28,
+      "type": "rect",
+      "width": 4,
+      "x": 3792,
+      "y": 44
+    },
+    {
+      "color": "#ffffff",
+      "height": 4,
+      "id": "tick-bl-h",
+      "opacity": 0.28,
+      "type": "rect",
+      "width": 52,
+      "x": 44,
+      "y": 2112
+    },
+    {
+      "color": "#ffffff",
+      "height": 52,
+      "id": "tick-bl-v",
+      "opacity": 0.28,
+      "type": "rect",
+      "width": 4,
+      "x": 44,
+      "y": 2064
+    },
+    {
+      "color": "#ffffff",
+      "height": 4,
+      "id": "tick-br-h",
+      "opacity": 0.28,
+      "type": "rect",
+      "width": 52,
+      "x": 3744,
+      "y": 2112
+    },
+    {
+      "color": "#ffffff",
+      "height": 52,
+      "id": "tick-br-v",
+      "opacity": 0.28,
+      "type": "rect",
+      "width": 4,
+      "x": 3792,
+      "y": 2064
+    },
+    {
+      "background": "#ffffff",
+      "background_opacity": 0.14,
+      "color": "$accent",
+      "direction": "right",
+      "fill_opacity": 1,
+      "height": 10,
+      "id": "meter-progress",
+      "max": "max",
+      "min": "min",
+      "radius": 5,
+      "type": "meter",
+      "value": "distance",
+      "width": 546,
+      "x": 104,
+      "y": 105
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.62,
+      "height": 56,
+      "id": "chip-wkg",
+      "type": "rect",
+      "width": 280,
+      "x": 104,
+      "y": 139
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-wkg",
+      "letter_spacing": 4,
+      "text": "W/KG",
+      "type": "label",
+      "vertical_align": "middle",
+      "x": 128,
+      "y": 168
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 1,
+      "font_size": 24,
+      "id": "value-wkg",
+      "tabular_figures": true,
+      "text_align": "right",
+      "type": "value",
+      "value": "power_to_weight",
+      "vertical_align": "middle",
+      "x": 360,
+      "y": 168
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.62,
+      "height": 56,
+      "id": "chip-alt",
+      "type": "rect",
+      "width": 250,
+      "x": 400,
+      "y": 139
+    },
+    {
+      "color": "$green",
+      "height": 14,
+      "id": "alt-dot",
+      "radius": 7,
+      "type": "rect",
+      "width": 14,
+      "x": 426,
+      "y": 160
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-alt-chip",
+      "letter_spacing": 4,
+      "text": "ALT",
+      "type": "label",
+      "vertical_align": "middle",
+      "x": 458,
+      "y": 168
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 0,
+      "font_size": 24,
+      "id": "value-alt-chip",
+      "suffix_mode": "auto",
+      "tabular_figures": true,
+      "text_align": "right",
+      "type": "value",
+      "value": "elevation",
+      "vertical_align": "middle",
+      "x": 626,
+      "y": 168
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.62,
+      "height": 360,
+      "id": "trace-panel",
+      "type": "rect",
+      "width": 560,
+      "x": 3176,
+      "y": 88
+    },
+    {
+      "color": "#ffffff",
+      "height": 2,
+      "id": "trace-divider",
+      "opacity": 0.1,
+      "type": "rect",
+      "width": 560,
+      "x": 3176,
+      "y": 148
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-trace",
+      "letter_spacing": 5,
+      "text": "TRACK TRACE",
+      "type": "label",
+      "vertical_align": "middle",
+      "x": 3204,
+      "y": 119
+    },
+    {
+      "color": "$accent",
+      "decimal_rounding": 1,
+      "font_size": 22,
+      "id": "value-trace-progress",
+      "suffix": " /",
+      "tabular_figures": true,
+      "text_align": "right",
+      "type": "value",
+      "value": "running_distance",
+      "vertical_align": "middle",
+      "x": 3618,
+      "y": 119
+    },
+    {
+      "color": "$muted",
+      "decimal_rounding": 1,
+      "font_size": 22,
+      "id": "value-trace-total",
+      "suffix_mode": "auto",
+      "tabular_figures": true,
+      "text_align": "right",
+      "type": "value",
+      "value": "total_distance",
+      "vertical_align": "middle",
+      "x": 3708,
+      "y": 119
+    },
+    {
+      "color": "$accent",
+      "fill": {
+        "opacity": 0
+      },
+      "height": 260,
+      "id": "plot-course",
+      "line": {
+        "future_opacity": 0.35,
+        "width": 6
+      },
+      "margin": 0.08,
+      "opacity": 0.85,
+      "point": {
+        "color": "#ffffff",
+        "edge_color": "$accent",
+        "edge_width": 5,
+        "weight": 500
+      },
+      "type": "plot",
+      "value": "course",
+      "width": 512,
+      "x": 3200,
+      "y": 168
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 280,
+      "id": "speed-panel",
+      "type": "rect",
+      "width": 460,
+      "x": 104,
+      "y": 1784
+    },
+    {
+      "color": "$accent",
+      "height": 280,
+      "id": "speed-accent",
+      "type": "rect",
+      "width": 8,
+      "x": 104,
+      "y": 1784
+    },
+    {
+      "color": "$muted",
+      "font_size": 24,
+      "id": "label-speed",
+      "letter_spacing": 7,
+      "text": "SPEED",
+      "type": "label",
+      "vertical_align": "top",
+      "x": 148,
+      "y": 1812
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 0,
+      "font": "BebasNeue-Regular.ttf",
+      "font_size": 236,
+      "id": "value-speed",
+      "tabular_figures": true,
+      "type": "value",
+      "value": "speed",
+      "vertical_align": "baseline",
+      "x": 148,
+      "y": 2036
+    },
+    {
+      "color": "$muted",
+      "font_size": 32,
+      "id": "label-mph",
+      "letter_spacing": 4,
+      "type": "label",
+      "unit_of": "speed",
+      "vertical_align": "baseline",
+      "x": 352,
+      "y": 2036
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 140,
+      "id": "cadence-panel",
+      "type": "rect",
+      "width": 264,
+      "x": 608,
+      "y": 1794
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-cadence",
+      "letter_spacing": 6,
+      "text": "CAD",
+      "text_align": "center",
+      "type": "label",
+      "vertical_align": "top",
+      "x": 740,
+      "y": 1818
+    },
+    {
+      "color": "$accent",
+      "decimal_rounding": 0,
+      "font": "BebasNeue-Regular.ttf",
+      "font_size": 92,
+      "id": "value-cadence",
+      "tabular_figures": true,
+      "text_align": "center",
+      "type": "value",
+      "value": "cadence",
+      "vertical_align": "baseline",
+      "x": 740,
+      "y": 1916
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 110,
+      "id": "power-bar-panel",
+      "type": "rect",
+      "width": 264,
+      "x": 608,
+      "y": 1954
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-power-bar",
+      "letter_spacing": 4,
+      "text": "PWR",
+      "type": "label",
+      "vertical_align": "middle",
+      "x": 630,
+      "y": 1984
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 0,
+      "font_size": 22,
+      "id": "value-power-bar",
+      "tabular_figures": true,
+      "text_align": "right",
+      "type": "value",
+      "value": "power",
+      "vertical_align": "middle",
+      "x": 850,
+      "y": 1984
+    },
+    {
+      "background": "#ffffff",
+      "background_opacity": 0.12,
+      "direction": "right",
+      "fill_opacity": 1,
+      "gap": 4,
+      "gradient": [
+        "$green",
+        "#f2c53d",
+        "$accent",
+        "$red"
+      ],
+      "height": 24,
+      "id": "meter-power",
+      "max": "max",
+      "min": 0,
+      "segments": 10,
+      "type": "meter",
+      "value": "power",
+      "width": 220,
+      "x": 630,
+      "y": 2010
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 208,
+      "id": "elev-panel",
+      "type": "rect",
+      "width": 1040,
+      "x": 1400,
+      "y": 1856
+    },
+    {
+      "color": "#ffffff",
+      "height": 2,
+      "id": "elev-divider",
+      "opacity": 0.1,
+      "type": "rect",
+      "width": 1040,
+      "x": 1400,
+      "y": 1916
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-elev-profile",
+      "letter_spacing": 5,
+      "text": "ELEVATION PROFILE",
+      "type": "label",
+      "vertical_align": "middle",
+      "x": 1432,
+      "y": 1887
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-alt",
+      "letter_spacing": 5,
+      "text": "ALT",
+      "type": "label",
+      "vertical_align": "middle",
+      "x": 2214,
+      "y": 1887
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 0,
+      "font_size": 22,
+      "id": "value-alt",
+      "suffix_mode": "auto",
+      "tabular_figures": true,
+      "text_align": "right",
+      "type": "value",
+      "value": "elevation",
+      "vertical_align": "middle",
+      "x": 2408,
+      "y": 1887
+    },
+    {
+      "color": "$accent",
+      "fill": {
+        "color": "$accent",
+        "opacity": 0.35
+      },
+      "height": 148,
+      "id": "plot-elevation",
+      "line": {
+        "width": 4
+      },
+      "margin": 0.05,
+      "point": {
+        "color": "#ffffff",
+        "remove_edge_color": true,
+        "weight": 260
+      },
+      "type": "plot",
+      "value": "elevation",
+      "width": 1040,
+      "x": 1400,
+      "y": 1916
+    },
+    {
+      "color": "$accent",
+      "height": 52,
+      "id": "grade-badge",
+      "type": "rect",
+      "width": 220,
+      "x": 1810,
+      "y": 1860
+    },
+    {
+      "color": "$dark",
+      "decimal_rounding": 0,
+      "font": "BebasNeue-Regular.ttf",
+      "font_size": 40,
+      "id": "value-grade",
+      "suffix": "% GRADE",
+      "tabular_figures": true,
+      "text_align": "center",
+      "type": "value",
+      "value": "gradient",
+      "vertical_align": "middle",
+      "x": 1920,
+      "y": 1886
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 114,
+      "id": "time-panel",
+      "type": "rect",
+      "width": 320,
+      "x": 3028,
+      "y": 1694
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-ride-time",
+      "letter_spacing": 5,
+      "text": "RIDE TIME",
+      "type": "label",
+      "vertical_align": "top",
+      "x": 3060,
+      "y": 1718
+    },
+    {
+      "color": "$text",
+      "font": "BebasNeue-Regular.ttf",
+      "font_size": 60,
+      "id": "value-ride-time",
+      "tabular_figures": true,
+      "time_format": "hh:mm:ss",
+      "type": "value",
+      "value": "time",
+      "vertical_align": "baseline",
+      "x": 3060,
+      "y": 1786
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 114,
+      "id": "distance-panel",
+      "type": "rect",
+      "width": 320,
+      "x": 3028,
+      "y": 1824
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-distance",
+      "letter_spacing": 5,
+      "text": "DISTANCE",
+      "type": "label",
+      "vertical_align": "top",
+      "x": 3060,
+      "y": 1848
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 1,
+      "font": "BebasNeue-Regular.ttf",
+      "font_size": 60,
+      "id": "value-distance",
+      "suffix_mode": "none",
+      "tabular_figures": true,
+      "type": "value",
+      "value": "distance",
+      "vertical_align": "baseline",
+      "x": 3060,
+      "y": 1916
+    },
+    {
+      "color": "$muted",
+      "font_size": 30,
+      "id": "label-mi",
+      "letter_spacing": 2,
+      "text_align": "right",
+      "type": "label",
+      "unit_of": "distance",
+      "vertical_align": "baseline",
+      "x": 3316,
+      "y": 1916
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 110,
+      "id": "gain-panel",
+      "type": "rect",
+      "width": 152,
+      "x": 3028,
+      "y": 1954
+    },
+    {
+      "color": "$muted",
+      "font_size": 20,
+      "id": "label-gain",
+      "letter_spacing": 4,
+      "text": "GAIN",
+      "text_align": "center",
+      "type": "label",
+      "vertical_align": "top",
+      "x": 3104,
+      "y": 1978
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 0,
+      "font": "BebasNeue-Regular.ttf",
+      "font_size": 52,
+      "id": "value-gain",
+      "tabular_figures": true,
+      "text_align": "center",
+      "type": "value",
+      "value": "running_elevation_gain",
+      "vertical_align": "baseline",
+      "x": 3104,
+      "y": 2040
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 110,
+      "id": "drop-panel",
+      "type": "rect",
+      "width": 152,
+      "x": 3196,
+      "y": 1954
+    },
+    {
+      "color": "$muted",
+      "font_size": 20,
+      "id": "label-drop",
+      "letter_spacing": 4,
+      "text": "DROP",
+      "text_align": "center",
+      "type": "label",
+      "vertical_align": "top",
+      "x": 3272,
+      "y": 1978
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 0,
+      "font": "BebasNeue-Regular.ttf",
+      "font_size": 52,
+      "id": "value-drop",
+      "tabular_figures": true,
+      "text_align": "center",
+      "type": "value",
+      "value": "running_elevation_loss",
+      "vertical_align": "baseline",
+      "x": 3272,
+      "y": 2040
+    },
+    {
+      "border_color": "$hairline",
+      "border_width": 2,
+      "color": "$panel",
+      "fill_opacity": 0.6,
+      "height": 324,
+      "id": "hr-panel",
+      "type": "rect",
+      "width": 356,
+      "x": 3380,
+      "y": 1740
+    },
+    {
+      "color": "$muted",
+      "font_size": 22,
+      "id": "label-hr",
+      "letter_spacing": 5,
+      "text": "HEART RATE",
+      "text_align": "center",
+      "type": "label",
+      "vertical_align": "top",
+      "x": 3558,
+      "y": 1768
+    },
+    {
+      "arc_color": "#ffffff24",
+      "arc_width": 14,
+      "cap_color": "#ffffff",
+      "cap_radius": 11,
+      "gradient": [
+        "$green",
+        "#f2c53d",
+        "$accent",
+        "$red"
+      ],
+      "height": 300,
+      "id": "gauge-hr",
+      "max": 200,
+      "min": 60,
+      "needle_width": 0,
+      "start_angle": 180,
+      "sweep_angle": 180,
+      "type": "gauge",
+      "value": "heartrate",
+      "width": 300,
+      "x": 3408,
+      "y": 1812
+    },
+    {
+      "color": "$text",
+      "decimal_rounding": 0,
+      "font": "BebasNeue-Regular.ttf",
+      "font_size": 68,
+      "id": "value-hr",
+      "tabular_figures": true,
+      "text_align": "right",
+      "type": "value",
+      "value": "heartrate",
+      "vertical_align": "baseline",
+      "x": 3570,
+      "y": 2040
+    },
+    {
+      "color": "$muted",
+      "font_size": 26,
+      "id": "label-bpm",
+      "letter_spacing": 3,
+      "text": "bpm",
+      "type": "label",
+      "vertical_align": "baseline",
+      "x": 3584,
+      "y": 2040
+    }
+  ],
+  "scene": {
+    "color": "$text",
+    "editor": {
+      "groups": [
+        {
+          "element_ids": [
+            "tick-tl-h",
+            "tick-tl-v",
+            "tick-tr-h",
+            "tick-tr-v",
+            "tick-bl-h",
+            "tick-bl-v",
+            "tick-br-h",
+            "tick-br-v"
+          ],
+          "id": "group-frame",
+          "name": "corner ticks"
+        },
+        {
+          "element_ids": [
+            "meter-progress"
+          ],
+          "id": "group-identity",
+          "name": "identity"
+        },
+        {
+          "element_ids": [
+            "chip-wkg",
+            "label-wkg",
+            "value-wkg",
+            "chip-alt",
+            "alt-dot",
+            "label-alt-chip",
+            "value-alt-chip"
+          ],
+          "id": "group-chips",
+          "name": "status chips"
+        },
+        {
+          "element_ids": [
+            "trace-panel",
+            "trace-divider",
+            "label-trace",
+            "value-trace-progress",
+            "value-trace-total",
+            "plot-course"
+          ],
+          "id": "group-trace",
+          "name": "track trace"
+        },
+        {
+          "element_ids": [
+            "speed-panel",
+            "speed-accent",
+            "label-speed",
+            "value-speed",
+            "label-mph"
+          ],
+          "id": "group-speed",
+          "name": "speed"
+        },
+        {
+          "element_ids": [
+            "cadence-panel",
+            "label-cadence",
+            "value-cadence"
+          ],
+          "id": "group-cadence",
+          "name": "cadence"
+        },
+        {
+          "element_ids": [
+            "power-bar-panel",
+            "label-power-bar",
+            "value-power-bar",
+            "meter-power"
+          ],
+          "id": "group-power-bar",
+          "name": "power bar"
+        },
+        {
+          "element_ids": [
+            "elev-panel",
+            "elev-divider",
+            "label-elev-profile",
+            "label-alt",
+            "value-alt",
+            "plot-elevation",
+            "grade-badge",
+            "value-grade"
+          ],
+          "id": "group-elevation",
+          "name": "elevation profile"
+        },
+        {
+          "element_ids": [
+            "time-panel",
+            "label-ride-time",
+            "value-ride-time",
+            "distance-panel",
+            "label-distance",
+            "value-distance",
+            "label-mi"
+          ],
+          "id": "group-stats",
+          "name": "ride stats"
+        },
+        {
+          "element_ids": [
+            "gain-panel",
+            "label-gain",
+            "value-gain",
+            "drop-panel",
+            "label-drop",
+            "value-drop"
+          ],
+          "id": "group-gain-drop",
+          "name": "gain / drop"
+        },
+        {
+          "element_ids": [
+            "hr-panel",
+            "label-hr",
+            "gauge-hr",
+            "value-hr",
+            "label-bpm"
+          ],
+          "id": "group-hr",
+          "name": "heart rate dial"
+        }
+      ]
+    },
+    "font": "rajdhani-bold.ttf",
+    "height": 2160,
+    "opacity": 1,
+    "vars": {
+      "accent": "#ff5a1f",
+      "dark": "#0b0f14",
+      "green": "#3de1ad",
+      "hairline": "#ffffff1f",
+      "muted": "#ffffff8c",
+      "panel": "#080a0c",
+      "red": "#e63946",
+      "text": "#f4f6f7"
+    },
+    "width": 3840
+  }
+}
\ No newline at end of file
diff --git a/templates/enduro_hud/preview.jpg b/templates/enduro_hud/preview.jpg
new file mode 100644
index 0000000..cf7ffd0
Binary files /dev/null and b/templates/enduro_hud/preview.jpg differ
diff --git a/website/content/templates.json b/website/content/templates.json
index 1142e7a..ccebd4d 100644
--- a/website/content/templates.json
+++ b/website/content/templates.json
@@ -21,6 +21,14 @@
     "githubUrl": "https://github.com/walkersutton/cyclemetry/tree/main/templates/crit",
     "jsonUrl": "https://raw.githubusercontent.com/walkersutton/cyclemetry/main/templates/crit/crit.json"
   },
+  {
+    "name": "enduro_hud",
+    "displayName": "Enduro HUD",
+    "design": null,
+    "previewUrl": "/templates/enduro_hud/preview.jpg",
+    "githubUrl": "https://github.com/walkersutton/cyclemetry/tree/main/templates/enduro_hud",
+    "jsonUrl": "https://raw.githubusercontent.com/walkersutton/cyclemetry/main/templates/enduro_hud/enduro_hud.json"
+  },
   {
     "name": "jeff",
     "displayName": "Jeff",
diff --git a/website/public/templates/enduro_hud/preview.jpg b/website/public/templates/enduro_hud/preview.jpg
new file mode 100644
index 0000000..cf7ffd0
Binary files /dev/null and b/website/public/templates/enduro_hud/preview.jpg differ