diff --git a/js/common/util/compute_state_display.js b/js/common/util/compute_state_display.js
index 8468d16487..4acb9390ea 100644
--- a/js/common/util/compute_state_display.js
+++ b/js/common/util/compute_state_display.js
@@ -15,7 +15,7 @@ export default function computeStateDisplay(localize, stateObj, language) {
       if (!stateObj._stateDisplay) {
         stateObj._stateDisplay = localize(`state.${domain}.default.${stateObj.state}`);
       }
-    } else if (stateObj.attributes.unit_of_measurement) {
+    } else if (stateObj.attributes.unit_of_measurement && !['unknown', 'unavailable'].includes(stateObj.state)) {
       stateObj._stateDisplay = stateObj.state + ' ' + stateObj.attributes.unit_of_measurement;
     } else if (domain === 'input_datetime') {
       let date;
diff --git a/test-mocha/common/util/compute_state_display.js b/test-mocha/common/util/compute_state_display.js
index 5f4c5386e9..542f11effe 100644
--- a/test-mocha/common/util/compute_state_display.js
+++ b/test-mocha/common/util/compute_state_display.js
@@ -55,6 +55,36 @@ describe('computeStateDisplay', () => {
     assert.strictEqual(computeStateDisplay(localize, stateObj, 'en'), '123 m');
   });
 
+  it('Localizes unknown sensor value with units', () => {
+    const altLocalize = function (message, ...args) {
+      if (message === 'state.sensor.unknown') return null;
+      return localize(message, ...args);
+    };
+    const stateObj = {
+      entity_id: 'sensor.test',
+      state: 'unknown',
+      attributes: {
+        unit_of_measurement: 'm',
+      },
+    };
+    assert.strictEqual(computeStateDisplay(altLocalize, stateObj, 'en'), 'state.default.unknown');
+  });
+
+  it('Localizes unavailable sensor value with units', () => {
+    const altLocalize = function (message, ...args) {
+      if (message === 'state.sensor.unavailable') return null;
+      return localize(message, ...args);
+    };
+    const stateObj = {
+      entity_id: 'sensor.test',
+      state: 'unavailable',
+      attributes: {
+        unit_of_measurement: 'm',
+      },
+    };
+    assert.strictEqual(computeStateDisplay(altLocalize, stateObj, 'en'), 'state.default.unavailable');
+  });
+
   it('Localizes input_datetime with full date time', () => {
     const stateObj = {
       entity_id: 'input_datetime.test',