diff --git a/ui/component/theme/src/components/or-vaadin-button.css b/ui/component/theme/src/components/or-vaadin-button.css
index 7b3795a110..8ae0850d80 100644
--- a/ui/component/theme/src/components/or-vaadin-button.css
+++ b/ui/component/theme/src/components/or-vaadin-button.css
@@ -24,6 +24,13 @@
   :host([theme~="primary"]) {
     min-width: var(--vaadin-button-min-width, 0);
   }
+  /* Lumo keeps the focus ring in the primary color for every color variant */
+  :host([theme~="error"]) {
+    --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-error-color-50pct));
+  }
+  :host([theme~="contrast"]) {
+    --_focus-ring-color: var(--vaadin-focus-ring-color, var(--lumo-contrast-50pct));
+  }
 }
 
 :root::before,
diff --git a/ui/component/theme/src/components/or-vaadin-menu-bar.css b/ui/component/theme/src/components/or-vaadin-menu-bar.css
index d323da4c6e..2c187dd732 100644
--- a/ui/component/theme/src/components/or-vaadin-menu-bar.css
+++ b/ui/component/theme/src/components/or-vaadin-menu-bar.css
@@ -18,6 +18,13 @@
  */
 @import "@vaadin/vaadin-lumo-styles/components/menu-bar.css";
 
+/* The menu bar clips its buttons at its edges, so draw their focus ring inside */
+@media lumo_components_menu-bar-button-internal {
+  :host([focus-ring]) {
+    box-shadow: inset 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
+  }
+}
+
 :root::before,
 :host::before {
   --_lumo-vaadin-menu-bar-inject: 1;
@@ -36,5 +43,6 @@
     lumo_components_item, lumo_components_context-menu-item, lumo_components_menu-bar-item;
 
   --_lumo-vaadin-menu-bar-button-inject: 1;
-  --_lumo-vaadin-menu-bar-button-inject-modules: lumo_components_button, lumo_components_menu-bar-button;
+  --_lumo-vaadin-menu-bar-button-inject-modules:
+    lumo_components_button, lumo_components_menu-bar-button, lumo_components_menu-bar-button-internal;
 }
diff --git a/ui/component/theme/src/mixins/field-internal.css b/ui/component/theme/src/mixins/field-internal.css
index abbad1673f..6d6e428274 100644
--- a/ui/component/theme/src/mixins/field-internal.css
+++ b/ui/component/theme/src/mixins/field-internal.css
@@ -30,4 +30,8 @@
   [class$="container"] {
     width: 100%; /* Lumo sets default field container width as 12em */
   }
+  /* Lumo draws the focus ring in the removed padding, so draw it inside the field where no ancestor can clip it */
+  :host([focus-ring]) [part="input-field"] {
+    box-shadow: inset 0 0 0 var(--_focus-ring-width) var(--_focus-ring-color);
+  }
 }