diff --git a/src/components/connection-modal/connection-modal.css b/src/components/connection-modal/connection-modal.css
index aec4ce630d51e7bf1bcc352d0b13855366d25b15..16f337ef460e7a88120f9b5fe49958bdec07ba91 100644
--- a/src/components/connection-modal/connection-modal.css
+++ b/src/components/connection-modal/connection-modal.css
@@ -121,9 +121,16 @@
 .radar-small {
     width: 40px;
     height: 40px;
+}
+
+[dir="ltr"] .radar-small {
     margin-right: 0.5rem;
 }
 
+[dir="rtl"] .radar-small {
+    margin-left: 0.5rem;
+}
+
 .radar-big {
     width: 120px;
     height: 120px;
@@ -184,6 +191,7 @@
     position: absolute;
     top: -5px;
     right: -15px;
+    left: -15px;
     padding: 5px 5px;
     background-color: $pen-primary;
     border-radius: 100%;
@@ -232,7 +240,6 @@
     flex-direction: row;
     justify-content: flex-start;
     align-items: center;
-    margin-left: 3rem;
 }
 
 [dir="ltr"] .scratch-link-help-step {
diff --git a/src/components/modal/modal.css b/src/components/modal/modal.css
index 1bb4f196343e94658a56c140447ee91ce4a739aa..1ed2425ce1e678a78ba93775343f3a9aed4a2a44 100644
--- a/src/components/modal/modal.css
+++ b/src/components/modal/modal.css
@@ -83,10 +83,14 @@ $sides: 20rem;
     user-select: none;
 }
 
-.header-image {
+[dir="ltr"] .header-image {
     margin-right: 0.5rem;
 }
 
+[dir="rtl"] .header-image {
+    margin-left: 0.5rem;
+}
+
 .header-item-filter {
     display: flex;
     flex-basis: $sides;