diff --git a/packages/custom-field/test/visual/material/screenshots/custom-field/baseline/form-layout-item-text-area.png b/packages/custom-field/test/visual/material/screenshots/custom-field/baseline/form-layout-item-text-area.png
index 1cfe0451476..6ad97c98753 100644
Binary files a/packages/custom-field/test/visual/material/screenshots/custom-field/baseline/form-layout-item-text-area.png and b/packages/custom-field/test/visual/material/screenshots/custom-field/baseline/form-layout-item-text-area.png differ
diff --git a/packages/form-layout/src/vaadin-form-layout-styles.js b/packages/form-layout/src/vaadin-form-layout-styles.js
index 453fc33c8b4..e40054a4ac2 100644
--- a/packages/form-layout/src/vaadin-form-layout-styles.js
+++ b/packages/form-layout/src/vaadin-form-layout-styles.js
@@ -15,6 +15,7 @@ export const formLayoutStyles = css`
     --vaadin-form-layout-row-spacing: 1em;
     --vaadin-form-layout-column-spacing: 2em; /* (default) */
     align-self: stretch;
+    padding-block: calc(var(--vaadin-form-layout-row-spacing) / 2);
   }
 
   :host([hidden]) {
@@ -52,7 +53,7 @@ export const formItemStyles = css`
       1. Use --vaadin-form-layout-row-spacing on the <vaadin-form-layout> component to control the gap between rows.
       2. Use standard CSS margin on <vaadin-form-layout> to control the spacing around the form layout itself.
     */
-    margin: calc(0.5 * var(--vaadin-form-item-row-spacing)) 0;
+    margin: calc((var(--vaadin-form-item-row-spacing) - var(--vaadin-form-layout-row-spacing)) / 2) 0;
   }
 
   :host([label-position='top']) {
diff --git a/packages/form-layout/test/visual/lumo/form-layout.test.js b/packages/form-layout/test/visual/lumo/form-layout.test.js
index 3f1395148aa..802931b9514 100644
--- a/packages/form-layout/test/visual/lumo/form-layout.test.js
+++ b/packages/form-layout/test/visual/lumo/form-layout.test.js
@@ -109,12 +109,12 @@ describe('form-layout', () => {
           <style>
             vaadin-form-layout {
               --vaadin-form-layout-column-spacing: 4em;
-              --vaadin-form-layout-row-spacing: 1.25em;
             }
 
             vaadin-form-item {
               --vaadin-form-item-label-width: 6em;
               --vaadin-form-item-label-spacing: 1em;
+              --vaadin-form-item-row-spacing: 1.25em;
             }
           </style>
           <vaadin-form-layout id="tests">
diff --git a/packages/form-layout/test/visual/material/form-layout.test.js b/packages/form-layout/test/visual/material/form-layout.test.js
index c95ffb83dc0..a9b34c0a3f6 100644
--- a/packages/form-layout/test/visual/material/form-layout.test.js
+++ b/packages/form-layout/test/visual/material/form-layout.test.js
@@ -109,12 +109,12 @@ describe('form-layout', () => {
           <style>
             vaadin-form-layout {
               --vaadin-form-layout-column-spacing: 4em;
-              --vaadin-form-layout-row-spacing: 1.25em;
             }
 
             vaadin-form-item {
               --vaadin-form-item-label-width: 6em;
               --vaadin-form-item-label-spacing: 1em;
+              --vaadin-form-item-row-spacing: 1.25em;
             }
           </style>
           <vaadin-form-layout id="tests">
diff --git a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/basic.png b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/basic.png
index 56a3cdb769d..a47433c1d47 100644
Binary files a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/basic.png and b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/basic.png differ
diff --git a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/br.png b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/br.png
index 84ad9e15c83..da12a6dc63a 100644
Binary files a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/br.png and b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/br.png differ
diff --git a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/colspan.png b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/colspan.png
index 02d5405498f..6371307c8b7 100644
Binary files a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/colspan.png and b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/colspan.png differ
diff --git a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/css-properties.png b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/css-properties.png
index 51358d28372..fe4589aca80 100644
Binary files a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/css-properties.png and b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/css-properties.png differ
diff --git a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/required-indicator-labels-aside.png b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/required-indicator-labels-aside.png
index 05d116071f8..bb19cafa70a 100644
Binary files a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/required-indicator-labels-aside.png and b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/required-indicator-labels-aside.png differ
diff --git a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/required-indicator-labels-on-top.png b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/required-indicator-labels-on-top.png
index af17f3acec0..57968b209dd 100644
Binary files a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/required-indicator-labels-on-top.png and b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/required-indicator-labels-on-top.png differ
diff --git a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/responsive-steps.png b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/responsive-steps.png
index fd7e523f4bc..df866e4bb29 100644
Binary files a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/responsive-steps.png and b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/responsive-steps.png differ
diff --git a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/single-column.png b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/single-column.png
index a79e1c09356..5da11f703cc 100644
Binary files a/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/single-column.png and b/packages/form-layout/test/visual/material/screenshots/form-layout/baseline/single-column.png differ