diff --git a/changes/changelog.d/897.bugfix b/changes/changelog.d/897.bugfix
new file mode 100644
index 0000000000000000000000000000000000000000..8101cda4cfab7e2b34fb139b98c13d668d903b8d
--- /dev/null
+++ b/changes/changelog.d/897.bugfix
@@ -0,0 +1 @@
+Fix regression to quota bar color (#897)
\ No newline at end of file
diff --git a/front/src/views/content/libraries/Quota.vue b/front/src/views/content/libraries/Quota.vue
index 687a825cf78e1d89b5770c98a7cfced695cead7e..f043b54b67d187abb629593666f99ddd9199cbe5 100644
--- a/front/src/views/content/libraries/Quota.vue
+++ b/front/src/views/content/libraries/Quota.vue
@@ -4,7 +4,7 @@
     <div v-if="isLoading" :class="['ui', {'active': isLoading}, 'inverted', 'dimmer']">
       <div class="ui text loader"><translate translate-context="Content/Library/Paragraph">Loading usage data…</translate></div>
     </div>
-    <div :class="['ui', {'success': progress < 60}, {'yellow': progress >= 60 && progress < 96}, {'error': progress >= 95}, 'progress']">
+    <div :class="['ui', {'success': progress < 60}, {'yellow': progress >= 60 && progress < 96}, {'error': progress >= 95}, 'progress']" data-percent=progress>
       <div class="bar" :style="{width: `${progress}%`}">
         <div class="progress">{{ progress }}%</div>
       </div>
@@ -154,4 +154,4 @@ export default {
     }
   }
 }
-</script>
+</script>
\ No newline at end of file