diff --git a/crates/bevy_ui/src/flex/mod.rs b/crates/bevy_ui/src/flex/mod.rs
index 471d8e3ead..acd341e2cf 100644
--- a/crates/bevy_ui/src/flex/mod.rs
+++ b/crates/bevy_ui/src/flex/mod.rs
@@ -293,8 +293,8 @@ pub fn flex_node_system(
             to_logical(layout.size.height),
         );
         // only trigger change detection when the new value is different
-        if node.size != new_size {
-            node.size = new_size;
+        if node.calculated_size != new_size {
+            node.calculated_size = new_size;
         }
         let mut new_position = transform.translation;
         new_position.x = to_logical(layout.location.x + layout.size.width / 2.0);
diff --git a/crates/bevy_ui/src/focus.rs b/crates/bevy_ui/src/focus.rs
index f83054b2a8..44ea324a12 100644
--- a/crates/bevy_ui/src/focus.rs
+++ b/crates/bevy_ui/src/focus.rs
@@ -144,7 +144,7 @@ pub fn ui_focus_system(
 
                 let position = global_transform.translation();
                 let ui_position = position.truncate();
-                let extents = node.size / 2.0;
+                let extents = node.calculated_size / 2.0;
                 let mut min = ui_position - extents;
                 let mut max = ui_position + extents;
                 if let Some(clip) = clip {
diff --git a/crates/bevy_ui/src/render/mod.rs b/crates/bevy_ui/src/render/mod.rs
index 0bee20aade..835d0fbc97 100644
--- a/crates/bevy_ui/src/render/mod.rs
+++ b/crates/bevy_ui/src/render/mod.rs
@@ -206,7 +206,7 @@ pub fn extract_uinodes(
             background_color: color.0,
             rect: Rect {
                 min: Vec2::ZERO,
-                max: uinode.size,
+                max: uinode.calculated_size,
             },
             image,
             atlas_size: None,
@@ -292,11 +292,11 @@ pub fn extract_text_uinodes(
             continue;
         }
         // Skip if size is set to zero (e.g. when a parent is set to `Display::None`)
-        if uinode.size == Vec2::ZERO {
+        if uinode.calculated_size == Vec2::ZERO {
             continue;
         }
         let text_glyphs = &text_layout_info.glyphs;
-        let alignment_offset = (uinode.size / -2.0).extend(0.0);
+        let alignment_offset = (uinode.calculated_size / -2.0).extend(0.0);
 
         let mut color = Color::WHITE;
         let mut current_section = usize::MAX;
diff --git a/crates/bevy_ui/src/ui_node.rs b/crates/bevy_ui/src/ui_node.rs
index 73d6ba4a6c..332567274b 100644
--- a/crates/bevy_ui/src/ui_node.rs
+++ b/crates/bevy_ui/src/ui_node.rs
@@ -16,7 +16,16 @@ use std::ops::{Add, AddAssign, Div, DivAssign, Mul, MulAssign, Sub, SubAssign};
 #[reflect(Component, Default)]
 pub struct Node {
     /// The size of the node as width and height in pixels
-    pub size: Vec2,
+    /// automatically calculated by [`super::flex::flex_node_system`]
+    pub(crate) calculated_size: Vec2,
+}
+
+impl Node {
+    /// The calculated node size as width and height in pixels
+    /// automatically calculated by [`super::flex::flex_node_system`]
+    pub fn size(&self) -> Vec2 {
+        self.calculated_size
+    }
 }
 
 /// An enum that describes possible types of value in flexbox layout options
diff --git a/crates/bevy_ui/src/update.rs b/crates/bevy_ui/src/update.rs
index 023d94d8d4..4b4398df1b 100644
--- a/crates/bevy_ui/src/update.rs
+++ b/crates/bevy_ui/src/update.rs
@@ -108,7 +108,7 @@ fn update_clipping(
         Overflow::Visible => clip,
         Overflow::Hidden => {
             let node_center = global_transform.translation().truncate();
-            let node_rect = Rect::from_center_size(node_center, node.size);
+            let node_rect = Rect::from_center_size(node_center, node.calculated_size);
             Some(clip.map_or(node_rect, |c| c.intersect(node_rect)))
         }
     };
diff --git a/examples/ui/ui.rs b/examples/ui/ui.rs
index 6b4c5dec0a..5f7d2fd6f3 100644
--- a/examples/ui/ui.rs
+++ b/examples/ui/ui.rs
@@ -308,9 +308,9 @@ fn mouse_scroll(
         for (mut scrolling_list, mut style, children, uinode) in &mut query_list {
             let items_height: f32 = children
                 .iter()
-                .map(|entity| query_item.get(*entity).unwrap().size.y)
+                .map(|entity| query_item.get(*entity).unwrap().size().y)
                 .sum();
-            let panel_height = uinode.size.y;
+            let panel_height = uinode.size().y;
             let max_scroll = (items_height - panel_height).max(0.);
             let dy = match mouse_wheel_event.unit {
                 MouseScrollUnit::Line => mouse_wheel_event.y * 20.,