diff --git a/res/css/views/rooms/_RoomBreadcrumbs.scss b/res/css/views/rooms/_RoomBreadcrumbs.scss
index 13fcbf2529..67350aac34 100644
--- a/res/css/views/rooms/_RoomBreadcrumbs.scss
+++ b/res/css/views/rooms/_RoomBreadcrumbs.scss
@@ -22,6 +22,19 @@ limitations under the License.
     display: flex;
     flex-direction: row;
 
+    // repeating circles as empty placeholders
+    background:
+        radial-gradient(
+            circle at center,
+            $breadcrumb-placeholder-bg-color,
+            $breadcrumb-placeholder-bg-color 15px,
+            transparent 16px
+        );
+    background-size: 36px;
+    background-position: 6px -1px;
+    background-repeat: repeat-x;
+
+
     // Autohide the scrollbar
     overflow-x: hidden;
     &:hover {
diff --git a/res/themes/dark/css/_dark.scss b/res/themes/dark/css/_dark.scss
index ef0b91b41a..eadde4c672 100644
--- a/res/themes/dark/css/_dark.scss
+++ b/res/themes/dark/css/_dark.scss
@@ -170,6 +170,8 @@ $tooltip-timeline-fg-color: #ffffff;
 $interactive-tooltip-bg-color: $base-color;
 $interactive-tooltip-fg-color: #ffffff;
 
+$breadcrumb-placeholder-bg-color: #272c35;
+
 // ***** Mixins! *****
 
 @define-mixin mx_DialogButton {
diff --git a/res/themes/light/css/_light.scss b/res/themes/light/css/_light.scss
index bfaac09761..db26c99155 100644
--- a/res/themes/light/css/_light.scss
+++ b/res/themes/light/css/_light.scss
@@ -288,6 +288,8 @@ $tooltip-timeline-fg-color: #ffffff;
 $interactive-tooltip-bg-color: #27303a;
 $interactive-tooltip-fg-color: #ffffff;
 
+$breadcrumb-placeholder-bg-color: #e8eef5;
+
 // ***** Mixins! *****
 
 @define-mixin mx_DialogButton {