diff --git a/crates/bevy_ui/src/ui_node.rs b/crates/bevy_ui/src/ui_node.rs
index 7b6209c685830..3a87765fea840 100644
--- a/crates/bevy_ui/src/ui_node.rs
+++ b/crates/bevy_ui/src/ui_node.rs
@@ -117,8 +117,8 @@ impl Default for Node {
 /// - [A Complete Guide To CSS Grid](https://css-tricks.com/snippets/css/complete-guide-grid/) by CSS Tricks. This is detailed guide with illustrations and comprehensive written explanation of the different CSS Grid properties and how they work.
 /// - [CSS Grid Garden](https://cssgridgarden.com/). An interactive tutorial/game that teaches the essential parts of CSS Grid in a fun engaging way.
 
-#[derive(Component, Clone, PartialEq, Debug, Reflect)]
-#[reflect(Component, Default, PartialEq)]
+#[derive(Component, Clone, PartialEq, Debug, Deserialize, Serialize, Reflect)]
+#[reflect(Component, Default, PartialEq, Deserialize, Serialize)]
 pub struct Style {
     /// Which layout algorithm to use when laying out this node's contents:
     ///   - [`Display::Flex`]: Use the Flexbox layout algorithm
@@ -1420,8 +1420,8 @@ pub enum GridPlacementError {
 ///
 /// This serves as the "fill" color.
 /// When combined with [`UiImage`], tints the provided texture.
-#[derive(Component, Copy, Clone, Debug, Reflect)]
-#[reflect(Component, Default)]
+#[derive(Component, Copy, Clone, Debug, Deserialize, Serialize, Reflect)]
+#[reflect(Component, Default, Deserialize, Serialize)]
 pub struct BackgroundColor(pub Color);
 
 impl BackgroundColor {
@@ -1453,8 +1453,8 @@ pub struct UiTextureAtlasImage {
 }
 
 /// The border color of the UI node.
-#[derive(Component, Copy, Clone, Debug, Reflect)]
-#[reflect(Component, Default)]
+#[derive(Component, Copy, Clone, Debug, Deserialize, Serialize, Reflect)]
+#[reflect(Component, Default, Deserialize, Serialize)]
 pub struct BorderColor(pub Color);
 
 impl From<Color> for BorderColor {
@@ -1473,8 +1473,8 @@ impl Default for BorderColor {
     }
 }
 
-#[derive(Component, Copy, Clone, Default, Debug, Reflect)]
-#[reflect(Component, Default)]
+#[derive(Component, Copy, Clone, Default, Debug, Deserialize, Serialize, Reflect)]
+#[reflect(Component, Default, Deserialize, Serialize)]
 /// The [`Outline`] component adds an outline outside the edge of a UI node.
 /// Outlines do not take up space in the layout
 ///