diff --git a/ratatui-core/src/layout/constraint.rs b/ratatui-core/src/layout/constraint.rs
index 86737f3d..d2d1fbb7 100644
--- a/ratatui-core/src/layout/constraint.rs
+++ b/ratatui-core/src/layout/constraint.rs
@@ -46,6 +46,7 @@ use strum::EnumIs;
 /// let constraints = Constraint::from_fills([1, 2, 1]);
 /// ```
 #[derive(Debug, Clone, Copy, Eq, PartialEq, Hash, EnumIs)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum Constraint {
     /// Applies a minimum size constraint to the element
     ///
diff --git a/ratatui-core/src/layout/direction.rs b/ratatui-core/src/layout/direction.rs
index a4c663e3..ba0bf4fb 100644
--- a/ratatui-core/src/layout/direction.rs
+++ b/ratatui-core/src/layout/direction.rs
@@ -1,6 +1,7 @@
 use strum::{Display, EnumString};
 
 #[derive(Debug, Default, Display, EnumString, Clone, Copy, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum Direction {
     Horizontal,
     #[default]
diff --git a/ratatui-core/src/layout/flex.rs b/ratatui-core/src/layout/flex.rs
index 2826ebf5..b4b16610 100644
--- a/ratatui-core/src/layout/flex.rs
+++ b/ratatui-core/src/layout/flex.rs
@@ -15,6 +15,7 @@ use crate::layout::Constraint;
 /// - `SpaceBetween`: Adds excess space between each element.
 /// - `SpaceAround`: Adds excess space around each element.
 #[derive(Copy, Debug, Default, Display, EnumString, Clone, Eq, PartialEq, Hash, EnumIs)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum Flex {
     /// Fills the available space within the container, putting excess space into the last
     /// constraint of the lowest priority. This matches the default behavior of ratatui and tui
diff --git a/ratatui-core/src/layout/layout.rs b/ratatui-core/src/layout/layout.rs
index d17b26ad..6b8e1169 100644
--- a/ratatui-core/src/layout/layout.rs
+++ b/ratatui-core/src/layout/layout.rs
@@ -75,6 +75,7 @@ std::thread_local! {
 ///
 /// See the [`Layout::spacing`] method for details on how to use this enum.
 #[derive(Debug, Clone, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum Spacing {
     Space(u16),
     Overlap(u16),
@@ -175,6 +176,7 @@ impl From<i16> for Spacing {
 /// [`kasuari`]: https://crates.io/crates/kasuari
 /// [Examples]: https://github.com/ratatui/ratatui/blob/main/examples/README.md
 #[derive(Debug, Default, Clone, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub struct Layout {
     direction: Direction,
     constraints: Vec<Constraint>,
diff --git a/ratatui-core/src/style/palette/material.rs b/ratatui-core/src/style/palette/material.rs
index 5ed7397f..0372ed36 100644
--- a/ratatui-core/src/style/palette/material.rs
+++ b/ratatui-core/src/style/palette/material.rs
@@ -419,6 +419,7 @@ use crate::style::Color;
 /// This is a collection of colors that are used in Material design. They consist of a set of
 /// colors from 50 to 900, and a set of accent colors from 100 to 700.
 #[derive(Debug, Clone, Copy, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub struct AccentedPalette {
     pub c50: Color,
     pub c100: Color,
@@ -441,6 +442,7 @@ pub struct AccentedPalette {
 /// This is a collection of colors that are used in Material design. They consist of a set of
 /// colors from 50 to 900.
 #[derive(Debug, Clone, Copy, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub struct NonAccentedPalette {
     pub c50: Color,
     pub c100: Color,
diff --git a/ratatui-core/src/style/palette/tailwind.rs b/ratatui-core/src/style/palette/tailwind.rs
index 764fc1a9..926d6316 100644
--- a/ratatui-core/src/style/palette/tailwind.rs
+++ b/ratatui-core/src/style/palette/tailwind.rs
@@ -277,6 +277,7 @@
 
 use crate::style::Color;
 
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub struct Palette {
     pub c50: Color,
     pub c100: Color,
diff --git a/ratatui-widgets/src/block/padding.rs b/ratatui-widgets/src/block/padding.rs
index 6201a675..6532bee2 100644
--- a/ratatui-widgets/src/block/padding.rs
+++ b/ratatui-widgets/src/block/padding.rs
@@ -23,6 +23,7 @@
 /// [`padding`]: crate::block::Block::padding
 /// [CSS padding]: https://developer.mozilla.org/en-US/docs/Web/CSS/padding
 #[derive(Debug, Default, Clone, Copy, Eq, PartialEq, Ord, PartialOrd, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub struct Padding {
     /// Left padding
     pub left: u16,
diff --git a/ratatui-widgets/src/borders.rs b/ratatui-widgets/src/borders.rs
index 1bd42fa0..5ade56a9 100644
--- a/ratatui-widgets/src/borders.rs
+++ b/ratatui-widgets/src/borders.rs
@@ -8,6 +8,7 @@ use strum::{Display, EnumString};
 bitflags! {
     /// Bitflags that can be composed to set the visible borders essentially on the block widget.
     #[derive(Default, Clone, Copy, Eq, PartialEq, Hash)]
+    #[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
     pub struct Borders: u8 {
         /// Show no border (default)
         const NONE   = 0b0000;
@@ -28,6 +29,7 @@ bitflags! {
 ///
 /// See the [`borders`](crate::block::Block::borders) method of `Block` to configure its borders.
 #[derive(Debug, Default, Display, EnumString, Clone, Copy, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum BorderType {
     /// A plain, simple border.
     ///
diff --git a/ratatui-widgets/src/list.rs b/ratatui-widgets/src/list.rs
index 9567ac00..1230afd3 100644
--- a/ratatui-widgets/src/list.rs
+++ b/ratatui-widgets/src/list.rs
@@ -133,6 +133,7 @@ pub struct List<'a> {
 ///
 /// See [`List::direction`].
 #[derive(Debug, Default, Display, EnumString, Clone, Copy, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum ListDirection {
     /// The first value is on the top, going to the bottom
     #[default]
diff --git a/ratatui-widgets/src/scrollbar.rs b/ratatui-widgets/src/scrollbar.rs
index 0ba92005..a482d676 100644
--- a/ratatui-widgets/src/scrollbar.rs
+++ b/ratatui-widgets/src/scrollbar.rs
@@ -106,6 +106,7 @@ pub struct Scrollbar<'a> {
 ///          HorizontalBottom
 /// ```
 #[derive(Debug, Default, Display, EnumString, Clone, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum ScrollbarOrientation {
     /// Positions the scrollbar on the right, scrolling vertically
     #[default]
@@ -162,6 +163,7 @@ pub struct ScrollbarState {
 ///
 /// It is useful for example when you want to store in which direction to scroll.
 #[derive(Debug, Default, Display, EnumString, Clone, Copy, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum ScrollDirection {
     /// Forward scroll direction, usually corresponds to scrolling downwards or rightwards.
     #[default]
diff --git a/ratatui-widgets/src/sparkline.rs b/ratatui-widgets/src/sparkline.rs
index 31147456..8c61198f 100644
--- a/ratatui-widgets/src/sparkline.rs
+++ b/ratatui-widgets/src/sparkline.rs
@@ -87,6 +87,7 @@ pub struct Sparkline<'a> {
 ///
 /// See [`Sparkline::direction`].
 #[derive(Debug, Default, Display, EnumString, Clone, Copy, Eq, PartialEq, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum RenderDirection {
     /// The first value is on the left, going to the right
     #[default]
diff --git a/ratatui-widgets/src/table/highlight_spacing.rs b/ratatui-widgets/src/table/highlight_spacing.rs
index b4b2d899..b375e577 100644
--- a/ratatui-widgets/src/table/highlight_spacing.rs
+++ b/ratatui-widgets/src/table/highlight_spacing.rs
@@ -2,6 +2,7 @@ use strum::{Display, EnumString};
 
 /// This option allows the user to configure the "highlight symbol" column width spacing
 #[derive(Debug, Display, EnumString, PartialEq, Eq, Clone, Default, Hash)]
+#[cfg_attr(feature = "serde", derive(serde::Serialize, serde::Deserialize))]
 pub enum HighlightSpacing {
     /// Always add spacing for the selection symbol column
     ///