diff --git a/demo/src/pages/components.rs b/demo/src/pages/components.rs
index 2b0a374..a2b213d 100644
--- a/demo/src/pages/components.rs
+++ b/demo/src/pages/components.rs
@@ -139,10 +139,26 @@ pub(crate) fn gen_menu_data() -> Vec<MenuGroupOption> {
                     value: "/components/accordion".into(),
                     label: "Accordion".into(),
                 },
+                MenuItemOption {
+                    value: "/components/alert".into(),
+                    label: "Alert".into(),
+                },
+                MenuItemOption {
+                    value: "/components/anchor".into(),
+                    label: "Anchor".into(),
+                },
+                MenuItemOption {
+                    value: "/components/auto-complete".into(),
+                    label: "Auto Complete".into(),
+                },
                 MenuItemOption {
                     value: "/components/avatar".into(),
                     label: "Avatar".into(),
                 },
+                MenuItemOption {
+                    value: "/components/back-top".into(),
+                    label: "Back Top".into(),
+                },
                 MenuItemOption {
                     value: "/components/badge".into(),
                     label: "Badge".into(),
@@ -155,10 +171,22 @@ pub(crate) fn gen_menu_data() -> Vec<MenuGroupOption> {
                     value: "/components/button".into(),
                     label: "Button".into(),
                 },
+                MenuItemOption {
+                    value: "/components/calendar".into(),
+                    label: "Calendar".into(),
+                },
                 MenuItemOption {
                     value: "/components/card".into(),
                     label: "Card".into(),
                 },
+                MenuItemOption {
+                    value: "/components/checkbox".into(),
+                    label: "Checkbox".into(),
+                },
+                MenuItemOption {
+                    value: "/components/color-picker".into(),
+                    label: "Color Picker".into(),
+                },
                 MenuItemOption {
                     value: "/components/config-provider".into(),
                     label: "Config Provider".into(),
@@ -171,14 +199,74 @@ pub(crate) fn gen_menu_data() -> Vec<MenuGroupOption> {
                     value: "/components/divider".into(),
                     label: "Divider".into(),
                 },
+                MenuItemOption {
+                    value: "/components/drawer".into(),
+                    label: "Drawer".into(),
+                },
+                MenuItemOption {
+                    value: "/components/grid".into(),
+                    label: "Grid".into(),
+                },
                 MenuItemOption {
                     value: "/components/icon".into(),
                     label: "Icon".into(),
                 },
+                MenuItemOption {
+                    value: "/components/image".into(),
+                    label: "Image".into(),
+                },
+                MenuItemOption {
+                    value: "/components/input".into(),
+                    label: "Input".into(),
+                },
+                MenuItemOption {
+                    value: "/components/layout".into(),
+                    label: "Layout".into(),
+                },
+                MenuItemOption {
+                    value: "/components/loading-bar".into(),
+                    label: "Loading Bar".into(),
+                },
+                MenuItemOption {
+                    value: "/components/message".into(),
+                    label: "Message".into(),
+                },
+                MenuItemOption {
+                    value: "/components/modal".into(),
+                    label: "Modal".into(),
+                },
+                MenuItemOption {
+                    value: "/components/popover".into(),
+                    label: "Popover".into(),
+                },
+                MenuItemOption {
+                    value: "/components/progress".into(),
+                    label: "Progress".into(),
+                },
+                MenuItemOption {
+                    value: "/components/radio".into(),
+                    label: "Radio".into(),
+                },
+                MenuItemOption {
+                    value: "/components/scrollbar".into(),
+                    label: "Scrollbar".into(),
+                },
+                MenuItemOption {
+                    value: "/components/select".into(),
+                    label: "Select".into(),
+                },
                 MenuItemOption {
                     value: "/components/skeleton".into(),
                     label: "Skeleton".into(),
                 },
+                MenuItemOption {
+                    value: "/components/slider".into(),
+                    label: "Slider".into(),
+                },
+                MenuItemOption {
+                    value: "/components/space".into(),
+                    label: "Space".into(),
+                },
                 MenuItemOption {
                     value: "/components/spin-button".into(),
                     label: "Spin Button".into(),
@@ -187,6 +275,10 @@ pub(crate) fn gen_menu_data() -> Vec<MenuGroupOption> {
                     value: "/components/spinner".into(),
                     label: "Spinner".into(),
                 },
+                MenuItemOption {
+                    value: "/components/switch".into(),
+                    label: "Switch".into(),
+                },
                 MenuItemOption {
                     value: "/components/tab-list".into(),
                     label: "Tab List".into(),
@@ -211,102 +303,10 @@ pub(crate) fn gen_menu_data() -> Vec<MenuGroupOption> {
                     value: "/components/time-picker".into(),
                     label: "Time Picker".into(),
                 },
-                MenuItemOption {
-                    value: "/components/auto-complete".into(),
-                    label: "Auto Complete".into(),
-                },
-                MenuItemOption {
-                    value: "/components/color-picker".into(),
-                    label: "Color Picker".into(),
-                },
-                MenuItemOption {
-                    value: "/components/checkbox".into(),
-                    label: "Checkbox".into(),
-                },
-                MenuItemOption {
-                    value: "/components/input".into(),
-                    label: "Input".into(),
-                },
-                MenuItemOption {
-                    value: "/components/radio".into(),
-                    label: "Radio".into(),
-                },
-                MenuItemOption {
-                    value: "/components/select".into(),
-                    label: "Select".into(),
-                },
-                MenuItemOption {
-                    value: "/components/slider".into(),
-                    label: "Slider".into(),
-                },
-                MenuItemOption {
-                    value: "/components/switch".into(),
-                    label: "Switch".into(),
-                },
                 MenuItemOption {
                     value: "/components/upload".into(),
                     label: "Upload".into(),
                 },
-                MenuItemOption {
-                    value: "/components/calendar".into(),
-                    label: "Calendar".into(),
-                },
-                MenuItemOption {
-                    value: "/components/image".into(),
-                    label: "Image".into(),
-                },
-                MenuItemOption {
-                    value: "/components/anchor".into(),
-                    label: "Anchor".into(),
-                },
-                MenuItemOption {
-                    value: "/components/back-top".into(),
-                    label: "Back Top".into(),
-                },
-                MenuItemOption {
-                    value: "/components/loading-bar".into(),
-                    label: "Loading Bar".into(),
-                },
-                MenuItemOption {
-                    value: "/components/alert".into(),
-                    label: "Alert".into(),
-                },
-                MenuItemOption {
-                    value: "/components/drawer".into(),
-                    label: "Drawer".into(),
-                },
-                MenuItemOption {
-                    value: "/components/message".into(),
-                    label: "Message".into(),
-                },
-                MenuItemOption {
-                    value: "/components/modal".into(),
-                    label: "Modal".into(),
-                },
-                MenuItemOption {
-                    value: "/components/popover".into(),
-                    label: "Popover".into(),
-                },
-                MenuItemOption {
-                    value: "/components/progress".into(),
-                    label: "Progress".into(),
-                },
-                MenuItemOption {
-                    value: "/components/layout".into(),
-                    label: "Layout".into(),
-                },
-                MenuItemOption {
-                    value: "/components/grid".into(),
-                    label: "Grid".into(),
-                },
-                MenuItemOption {
-                    value: "/components/space".into(),
-                    label: "Space".into(),
-                },
-                MenuItemOption {
-                    value: "/components/scrollbar".into(),
-                    label: "Scrollbar".into(),
-                },
             ],
         },
         MenuGroupOption {
diff --git a/thaw/src/menu/menu-group.css b/thaw/src/menu/menu-group.css
deleted file mode 100644
index 2825d93..0000000
--- a/thaw/src/menu/menu-group.css
+++ /dev/null
@@ -1,6 +0,0 @@
-.thaw-menu-group {
-    padding: 0.85rem 1.15em 0.1rem;
-    font-size: 0.86rem;
-    font-weight: bold;
-    color: var(--thaw-font-color);
-}
diff --git a/thaw/src/menu/menu-item.css b/thaw/src/menu/menu-item.css
deleted file mode 100644
index 7a8772a..0000000
--- a/thaw/src/menu/menu-item.css
+++ /dev/null
@@ -1,22 +0,0 @@
-.thaw-menu-item__content {
-    margin: 0.3rem 0.4rem;
-    padding: 0.5rem 0.75rem;
-    color: var(--thaw-font-color);
-    cursor: pointer;
-    border-radius: 0.25rem;
-    font-size: 0.875rem;
-    line-height: 1.25rem;
-
-    transition-property: color, background-color;
-    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-    transition-duration: 0.15s;
-}
-
-.thaw-menu-item__content:hover:not(.thaw-menu-item__content--selected) {
-    background-color: var(--thaw-background-color-hover);
-}
-
-.thaw-menu-item__content--selected {
-    color: var(--thaw-font-color-active);
-    background-color: var(--thaw-background-color);
-}
diff --git a/thaw/src/menu/menu_group.rs b/thaw/src/menu/menu_group.rs
deleted file mode 100644
index ab54667..0000000
--- a/thaw/src/menu/menu_group.rs
+++ /dev/null
@@ -1,30 +0,0 @@
-use crate::{theme::use_theme, Theme};
-use leptos::*;
-use thaw_utils::{class_list, mount_style, OptionalProp};
-
-#[component]
-pub fn MenuGroup(
-    #[prop(into)] label: String,
-    #[prop(optional, into)] class: OptionalProp<MaybeSignal<String>>,
-    children: Children,
-) -> impl IntoView {
-    mount_style("menu-group", include_str!("./menu-group.css"));
-    let theme = use_theme(Theme::light);
-    let css_vars = create_memo(move |_| {
-        let mut css_vars = String::new();
-        theme.with(|theme| {
-            css_vars.push_str(&format!("--thaw-font-color: {};", theme.menu.group_color));
-        });
-        css_vars
-    });
-
-    view! {
-        <div
-            class=class_list!["thaw-menu-group", class.map(| c | move || c.get())]
-            style=move || css_vars.get()
-        >
-            {label}
-        </div>
-        {children()}
-    }
-}
diff --git a/thaw/src/menu/menu_item.rs b/thaw/src/menu/menu_item.rs
deleted file mode 100644
index f72fe16..0000000
--- a/thaw/src/menu/menu_item.rs
+++ /dev/null
@@ -1,53 +0,0 @@
-use super::use_menu;
-use crate::{theme::use_theme, Theme};
-use leptos::*;
-use thaw_utils::{class_list, mount_style, OptionalProp};
-
-#[component]
-pub fn MenuItem(
-    #[prop(into)] key: MaybeSignal<String>,
-    #[prop(into)] label: MaybeSignal<String>,
-    #[prop(optional, into)] class: OptionalProp<MaybeSignal<String>>,
-) -> impl IntoView {
-    mount_style("menu-item", include_str!("./menu-item.css"));
-    let theme = use_theme(Theme::light);
-    let menu = use_menu();
-    let click_key = key.clone();
-    let on_click = move |_| {
-        let click_key = click_key.get();
-        if menu.0.with(|key| key != &click_key) {
-            menu.0.set(click_key);
-        }
-    };
-
-    let css_vars = create_memo(move |_| {
-        let mut css_vars = String::new();
-        theme.with(|theme| {
-            let font_color = theme.common.color_primary.clone();
-            css_vars.push_str(&format!("--thaw-font-color-active: {font_color};"));
-            css_vars.push_str(&format!("--thaw-font-color: {};", theme.menu.color));
-            css_vars.push_str(&format!("--thaw-background-color: {font_color}1a;"));
-            css_vars.push_str(&format!(
-                "--thaw-background-color-hover: {};",
-                theme.menu.item_color_hover
-            ));
-        });
-        css_vars
-    });
-
-    view! {
-        <div class="thaw-menu-item">
-            <div
-                class=class_list![
-                    "thaw-menu-item__content", ("thaw-menu-item__content--selected", move || menu.0
-                    .get() == key.get()), class.map(| c | move || c.get())
-                ]
-
-                on:click=on_click
-                style=move || css_vars.get()
-            >
-                {move || label.get()}
-            </div>
-        </div>
-    }
-}
diff --git a/thaw/src/menu/mod.rs b/thaw/src/menu/mod.rs
deleted file mode 100644
index 08598dc..0000000
--- a/thaw/src/menu/mod.rs
+++ /dev/null
@@ -1,30 +0,0 @@
-mod menu_group;
-mod menu_item;
-mod theme;
-
-pub use menu_group::MenuGroup;
-pub use menu_item::*;
-pub use theme::MenuTheme;
-
-use leptos::*;
-use thaw_utils::{class_list, Model, OptionalProp};
-
-#[component]
-pub fn Menu(
-    #[prop(optional, into)] value: Model<String>,
-    #[prop(optional, into)] class: OptionalProp<MaybeSignal<String>>,
-    children: Children,
-) -> impl IntoView {
-    view! {
-        <Provider value=MenuInjection(value)>
-            <div class=class_list!["thaw-menu", class.map(| c | move || c.get())]>{children()}</div>
-        </Provider>
-    }
-}
-
-#[derive(Clone)]
-pub(crate) struct MenuInjection(pub Model<String>);
-
-pub(crate) fn use_menu() -> MenuInjection {
-    expect_context()
-}
diff --git a/thaw/src/menu/theme.rs b/thaw/src/menu/theme.rs
deleted file mode 100644
index 0305d69..0000000
--- a/thaw/src/menu/theme.rs
+++ /dev/null
@@ -1,26 +0,0 @@
-use crate::theme::ThemeMethod;
-
-#[derive(Clone)]
-pub struct MenuTheme {
-    pub color: String,
-    pub item_color_hover: String,
-    pub group_color: String,
-}
-
-impl ThemeMethod for MenuTheme {
-    fn light() -> Self {
-        Self {
-            color: "#4b5263".into(),
-            item_color_hover: "#f3f5f6".into(),
-            group_color: "#111727".into(),
-        }
-    }
-
-    fn dark() -> Self {
-        Self {
-            color: "#9ca5b0".into(),
-            item_color_hover: "#383f5233".into(),
-            group_color: "#ffffffe6".into(),
-        }
-    }
-}