diff --git a/demo/Cargo.toml b/demo/Cargo.toml
index 9cd1532..2867825 100644
--- a/demo/Cargo.toml
+++ b/demo/Cargo.toml
@@ -12,14 +12,7 @@ leptos_meta = { version = "0.5.7" }
 leptos_router = { version = "0.5.7" }
 leptos_devtools = { version = "0.0.1", optional = true}
 thaw = { path = "../thaw", default-features = false }
-icondata = { version = "0.1.0", features = [
-    "AiCloseOutlined",
-    "AiCheckOutlined",
-    "AiGithubOutlined",
-    "AiUserOutlined",
-    "AiSearchOutlined",
-    "AiUnorderedListOutlined"
-] }
+icondata = "0.3.0"
 demo_markdown = { path = "../demo_markdown" }
 
 [features]
@@ -41,4 +34,4 @@ nightly = ["leptos/nightly", "leptos_meta/nightly", "leptos_router/nightly"]
 opt-level = 1
 
 [profile.dev.package."*"]
-opt-level = 3
\ No newline at end of file
+opt-level = 3
diff --git a/demo/src/components/site_header.rs b/demo/src/components/site_header.rs
index dacbb75..730c869 100644
--- a/demo/src/components/site_header.rs
+++ b/demo/src/components/site_header.rs
@@ -141,14 +141,14 @@ pub fn SiteHeader() -> impl IntoView {
                     comp_ref=auto_complete_ref
                 >
                     <AutoCompletePrefix slot>
-                        <Icon icon=icondata::Icon::from(icondata::AiIcon::AiSearchOutlined) style="font-size: 18px; color: var(--thaw-placeholder-color);"/>
+                        <Icon icon=icondata::AiSearchOutlined style="font-size: 18px; color: var(--thaw-placeholder-color);"/>
                     </AutoCompletePrefix>
                 </AutoComplete>
                 <Popover placement=PopoverPlacement::BottomEnd class="demo-header__menu-popover-mobile">
                     <PopoverTrigger slot class="demo-header__menu-mobile">
                         <Button
                             variant=ButtonVariant::Text
-                            icon=icondata::AiIcon::AiUnorderedListOutlined
+                            icon=icondata::AiUnorderedListOutlined
                             style="font-size: 22px; padding: 0px 6px;"
                         />
                     </PopoverTrigger>
@@ -192,7 +192,7 @@ pub fn SiteHeader() -> impl IntoView {
                     </Button>
                     <Button
                         variant=ButtonVariant::Text
-                        icon=icondata::AiIcon::AiGithubOutlined
+                        icon=icondata::AiGithubOutlined
                         round=true
                         style="font-size: 22px; padding: 0px 6px;"
                         on_click=move |_| {
diff --git a/demo/src/pages/nav_bar/mod.rs b/demo/src/pages/nav_bar/mod.rs
index 6623349..79709a7 100644
--- a/demo/src/pages/nav_bar/mod.rs
+++ b/demo/src/pages/nav_bar/mod.rs
@@ -32,7 +32,7 @@ pub fn NavBarDemoPage() -> impl IntoView {
                 on_click_right=on_click_right
             >
                 <NavBarRight slot>
-                     <Icon icon=icondata::Icon::from(icondata::AiIcon::AiCloseOutlined)/>
+                     <Icon icon=icondata::AiCloseOutlined/>
                 </NavBarRight>
             </NavBar>
             <div style="padding-top: 50px">{move || click_text.get()}</div>
diff --git a/demo/src/pages/tabbar/mod.rs b/demo/src/pages/tabbar/mod.rs
index beee429..7330265 100644
--- a/demo/src/pages/tabbar/mod.rs
+++ b/demo/src/pages/tabbar/mod.rs
@@ -23,7 +23,7 @@ pub fn TabbarDemoPage() -> impl IntoView {
             {move || value.get()} <Tabbar value>
                 <TabbarItem key="a">"and"</TabbarItem>
                 <TabbarItem key="i">"if"</TabbarItem>
-                <TabbarItem key="o" icon=icondata::AiIcon::AiCloseOutlined>
+                <TabbarItem key="o" icon=icondata::AiCloseOutlined>
                     "or"
                 </TabbarItem>
             </Tabbar>
diff --git a/demo_markdown/docs/_mobile/nav_bar/mod.md b/demo_markdown/docs/_mobile/nav_bar/mod.md
index d2275e2..78993a1 100644
--- a/demo_markdown/docs/_mobile/nav_bar/mod.md
+++ b/demo_markdown/docs/_mobile/nav_bar/mod.md
@@ -17,7 +17,7 @@ view! {
             on_click_right=on_click_right
         >
             <NavBarRight slot>
-                 <Icon icon=icondata::Icon::from(icondata::AiIcon::AiCloseOutlined)/> 
+                 <Icon icon=icondata::AiCloseOutlined/> 
             </NavBarRight>
         </NavBar>
         <div style="padding-top: 50px">{move || click_text.get()}</div>
diff --git a/demo_markdown/docs/_mobile/tabbar/mod.md b/demo_markdown/docs/_mobile/tabbar/mod.md
index 9ec50ea..f145a90 100644
--- a/demo_markdown/docs/_mobile/tabbar/mod.md
+++ b/demo_markdown/docs/_mobile/tabbar/mod.md
@@ -11,7 +11,7 @@ view! {
         <Tabbar value>
             <TabbarItem key="a">"and"</TabbarItem>
             <TabbarItem key="i">"if"</TabbarItem>
-            <TabbarItem key="o" icon=icondata::AiIcon::AiCloseOutlined>
+            <TabbarItem key="o" icon=icondata::AiCloseOutlined>
                 "or"
             </TabbarItem>
         </Tabbar>
diff --git a/demo_markdown/docs/auto_complete/mod.md b/demo_markdown/docs/auto_complete/mod.md
index 6304933..9fa5d96 100644
--- a/demo_markdown/docs/auto_complete/mod.md
+++ b/demo_markdown/docs/auto_complete/mod.md
@@ -44,12 +44,12 @@ view! {
     <Space vertical=true>
         <AutoComplete>
             <AutoCompletePrefix slot>
-                <Icon icon=icondata::Icon::from(icondata::AiIcon::AiUserOutlined)/>
+                <Icon icon=icondata::AiUserOutlined/>
             </AutoCompletePrefix>
         </AutoComplete>
         <AutoComplete>
             <AutoCompleteSuffix slot>
-                <Icon icon=icondata::Icon::from(icondata::AiIcon::AiGithubOutlined)/>
+                <Icon icon=icondata::AiGithubOutlined/>
             </AutoCompleteSuffix>
         </AutoComplete>
     </Space>
diff --git a/demo_markdown/docs/button/mod.md b/demo_markdown/docs/button/mod.md
index 38baa54..81e737e 100644
--- a/demo_markdown/docs/button/mod.md
+++ b/demo_markdown/docs/button/mod.md
@@ -29,17 +29,17 @@ view! {
 ```rust demo
 view! {
     <Space>
-        <Button color=ButtonColor::Error icon=icondata::AiIcon::AiCloseOutlined>
+        <Button color=ButtonColor::Error icon=icondata::AiCloseOutlined>
             "Error Color Icon"
         </Button>
         <Button
             color=ButtonColor::Error
-            icon=icondata::AiIcon::AiCloseOutlined
+            icon=icondata::AiCloseOutlined
             round=true
         />
         <Button
             color=ButtonColor::Error
-            icon=icondata::AiIcon::AiCloseOutlined
+            icon=icondata::AiCloseOutlined
             circle=true
         />
     </Space>
@@ -62,7 +62,7 @@ let on_click = move |_| {
 
 view! {
     <Space>
-        <Button loading on_click icon=icondata::AiIcon::AiCloseOutlined>
+        <Button loading on_click icon=icondata::AiCloseOutlined>
             "Click Me"
         </Button>
         <Button loading on_click>
diff --git a/demo_markdown/docs/icon/mod.md b/demo_markdown/docs/icon/mod.md
index 570c9dc..78c400a 100644
--- a/demo_markdown/docs/icon/mod.md
+++ b/demo_markdown/docs/icon/mod.md
@@ -3,8 +3,8 @@
 ```rust demo
 view! {
     <Space>
-        <Icon icon=icondata::Icon::from(icondata::AiIcon::AiCloseOutlined)/>
-        <Icon icon=icondata::Icon::from(icondata::AiIcon::AiCheckOutlined)/>
+        <Icon icon=icondata::AiCloseOutlined/>
+        <Icon icon=icondata::AiCheckOutlined/>
     </Space>
 }
 ```
diff --git a/demo_markdown/docs/input/mod.md b/demo_markdown/docs/input/mod.md
index 730c14d..01ddf12 100644
--- a/demo_markdown/docs/input/mod.md
+++ b/demo_markdown/docs/input/mod.md
@@ -79,7 +79,7 @@ view! {
     <Space vertical=true>
         <Input value>
             <InputPrefix slot>
-                <Icon icon=icondata::Icon::from(icondata::AiIcon::AiUserOutlined)/>
+                <Icon icon=icondata::AiUserOutlined/>
             </InputPrefix>
         </Input>
         <Input value>
@@ -87,7 +87,7 @@ view! {
         </Input>
         <Input value>
             <InputSuffix slot>
-                <Icon icon=icondata::Icon::from(icondata::AiIcon::AiGithubOutlined)/>
+                <Icon icon=icondata::AiGithubOutlined/>
             </InputSuffix>
         </Input>
     </Space>
@@ -125,4 +125,4 @@ view! {
 
 ### TextArea Props
 
-Removes variant and slot from Input component.
\ No newline at end of file
+Removes variant and slot from Input component.
diff --git a/thaw/Cargo.toml b/thaw/Cargo.toml
index 2c57f22..fa56b66 100644
--- a/thaw/Cargo.toml
+++ b/thaw/Cargo.toml
@@ -22,24 +22,8 @@ web-sys = { version = "0.3.63", features = [
     "DataTransfer",
 ] }
 wasm-bindgen = "0.2.89"
-icondata = { version = "0.1.0", features = [
-    "AiCloseOutlined",
-    "AiCheckOutlined",
-    "AiLeftOutlined",
-    "AiLoadingOutlined",
-    "AiCheckCircleFilled",
-    "AiExclamationCircleFilled",
-    "AiCloseCircleFilled",
-    "AiPlusOutlined",
-    "AiPlusOutlined",
-    "AiMinusOutlined",
-    "AiRightOutlined",
-    "AiClockCircleOutlined",
-    "AiCalendarOutlined",
-    "AiArrowLeftOutlined",
-    "AiArrowRightOutlined",
-] }
-icondata_core = "0.0.2"
+icondata = "0.3.0"
+icondata_core = "0.1.0"
 uuid = { version = "1.5.0", features = ["v4"] }
 cfg-if = "1.0.0"
 chrono = "0.4.31"
diff --git a/thaw/src/alert/mod.rs b/thaw/src/alert/mod.rs
index 5ba585f..694f546 100644
--- a/thaw/src/alert/mod.rs
+++ b/thaw/src/alert/mod.rs
@@ -5,7 +5,6 @@ use crate::{
     utils::{class_list::class_list, mount_style},
     Icon, Theme,
 };
-use icondata::AiIcon;
 use leptos::*;
 pub use theme::AlertTheme;
 
@@ -77,9 +76,9 @@ pub fn Alert(
     });
     let icon = create_memo(move |_| {
         match variant.get() {
-            AlertVariant::Success => AiIcon::AiCheckCircleFilled,
-            AlertVariant::Warning => AiIcon::AiExclamationCircleFilled,
-            AlertVariant::Error => AiIcon::AiCloseCircleFilled,
+            AlertVariant::Success => icondata::AiCheckCircleFilled,
+            AlertVariant::Warning => icondata::AiExclamationCircleFilled,
+            AlertVariant::Error => icondata::AiCloseCircleFilled,
         }
         .into()
     });
diff --git a/thaw/src/button/mod.rs b/thaw/src/button/mod.rs
index 79472d4..c4c776a 100644
--- a/thaw/src/button/mod.rs
+++ b/thaw/src/button/mod.rs
@@ -240,7 +240,7 @@ pub fn Button(
                 if loading.get() {
                     view! {
                         <Icon
-                            icon=Icon::from(AiIcon::AiLoadingOutlined)
+                            icon=icondata::AiLoadingOutlined
                             style=format!(
                                 "animation: thawLoadingCircle 1s infinite linear;{icon_style}",
                             )
diff --git a/thaw/src/calendar/mod.rs b/thaw/src/calendar/mod.rs
index a221b5d..78b3f6e 100644
--- a/thaw/src/calendar/mod.rs
+++ b/thaw/src/calendar/mod.rs
@@ -7,7 +7,6 @@ use crate::{
     Button, ButtonGroup, ButtonVariant, Theme,
 };
 use chrono::{Month, Months};
-use icondata::AiIcon;
 use leptos::*;
 use std::ops::Deref;
 pub use theme::CalendarTheme;
@@ -137,7 +136,7 @@ pub fn Calendar(
                     <ButtonGroup>
                         <Button
                             variant=ButtonVariant::Solid
-                            icon=AiIcon::AiLeftOutlined
+                            icon=icondata::AiLeftOutlined
                             on_click=previous_month
                         />
                         <Button variant=ButtonVariant::Solid on_click=today>
@@ -145,7 +144,7 @@ pub fn Calendar(
                         </Button>
                         <Button
                             variant=ButtonVariant::Solid
-                            icon=AiIcon::AiRightOutlined
+                            icon=icondata::AiRightOutlined
                             on_click=next_month
                         />
                     </ButtonGroup>
diff --git a/thaw/src/checkbox/mod.rs b/thaw/src/checkbox/mod.rs
index c19984a..b607aab 100644
--- a/thaw/src/checkbox/mod.rs
+++ b/thaw/src/checkbox/mod.rs
@@ -10,7 +10,6 @@ use crate::{
 };
 pub use checkbox_group::CheckboxGroup;
 pub use checkbox_item::CheckboxItem;
-use icondata::AiIcon;
 use leptos::*;
 
 #[component]
@@ -47,7 +46,7 @@ pub fn Checkbox(
             <div class="thaw-checkbox__dot">
                 <If cond=value>
                     <Then slot>
-                        <Icon icon=Icon::from(AiIcon::AiCheckOutlined) style="color: white"/>
+                        <Icon icon=icondata::AiCheckOutlined style="color: white"/>
                     </Then>
                 </If>
             </div>
diff --git a/thaw/src/collapse/collapse_item.rs b/thaw/src/collapse/collapse_item.rs
index f39725c..3bb55ca 100644
--- a/thaw/src/collapse/collapse_item.rs
+++ b/thaw/src/collapse/collapse_item.rs
@@ -4,7 +4,6 @@ use crate::{
     utils::{class_list::class_list, StoredMaybeSignal},
     Icon,
 };
-use icondata::AiIcon;
 use leptos::*;
 
 #[component]
@@ -48,7 +47,7 @@ pub fn CollapseItem(
             move || class.get()
         ]>
             <div class="thaw-collapse-item__header" on:click=on_click>
-                <Icon icon=Icon::from(AiIcon::AiRightOutlined) class="thaw-collapse-item-arrow"/>
+                <Icon icon=icondata::AiRightOutlined class="thaw-collapse-item-arrow"/>
                 {move || title.get()}
             </div>
             <CSSTransition node_ref=content_ref show=is_show_content name="thaw-collapse-item" let:display>
diff --git a/thaw/src/date_picker/mod.rs b/thaw/src/date_picker/mod.rs
index baaf82a..639c8ce 100644
--- a/thaw/src/date_picker/mod.rs
+++ b/thaw/src/date_picker/mod.rs
@@ -5,7 +5,7 @@ use crate::{
     chrono::NaiveDate,
     components::{Binder, Follower, FollowerPlacement},
     utils::{mount_style, now_date, ComponentRef},
-    AiIcon, Icon, Input, InputSuffix, SignalWatch,
+    Icon, Input, InputSuffix, SignalWatch,
 };
 use leptos::*;
 use panel::{Panel, PanelRef};
@@ -76,7 +76,7 @@ pub fn DatePicker(
             <div ref=date_picker_ref>
                 <Input attrs class value=show_date_text on_focus=open_panel on_blur=on_input_blur>
                     <InputSuffix slot>
-                        <Icon icon=Icon::from(AiIcon::AiCalendarOutlined) style="font-size: 18px"/>
+                        <Icon icon=icondata::AiCalendarOutlined style="font-size: 18px"/>
                     </InputSuffix>
                 </Input>
             </div>
diff --git a/thaw/src/date_picker/panel/date_panel.rs b/thaw/src/date_picker/panel/date_panel.rs
index 624c1e6..ff41dee 100644
--- a/thaw/src/date_picker/panel/date_panel.rs
+++ b/thaw/src/date_picker/panel/date_panel.rs
@@ -2,7 +2,7 @@ use super::PanelVariant;
 use crate::{
     chrono::{Datelike, Days, Month, Months, NaiveDate},
     utils::now_date,
-    AiIcon, Button, ButtonSize, ButtonVariant, CalendarItemDate,
+    Button, ButtonSize, ButtonVariant, CalendarItemDate,
 };
 use leptos::*;
 use std::ops::Deref;
@@ -92,13 +92,13 @@ pub fn DatePanel(
                     <Button
                         variant=ButtonVariant::Link
                         size=ButtonSize::Small
-                        icon=AiIcon::AiArrowLeftOutlined
+                        icon=icondata::AiArrowLeftOutlined
                         on_click=previous_year
                     />
                     <Button
                         variant=ButtonVariant::Link
                         size=ButtonSize::Small
-                        icon=AiIcon::AiLeftOutlined
+                        icon=icondata::AiLeftOutlined
                         on_click=previous_month
                     />
                     <div class="thaw-date-picker-date-panel__header-month-year">
@@ -120,13 +120,13 @@ pub fn DatePanel(
                     <Button
                         variant=ButtonVariant::Link
                         size=ButtonSize::Small
-                        icon=AiIcon::AiRightOutlined
+                        icon=icondata::AiRightOutlined
                         on_click=next_month
                     />
                     <Button
                         variant=ButtonVariant::Link
                         size=ButtonSize::Small
-                        icon=AiIcon::AiArrowRightOutlined
+                        icon=icondata::AiArrowRightOutlined
                         on_click=next_year
                     />
                 </div>
diff --git a/thaw/src/date_picker/panel/month_panel.rs b/thaw/src/date_picker/panel/month_panel.rs
index d139291..096aeb8 100644
--- a/thaw/src/date_picker/panel/month_panel.rs
+++ b/thaw/src/date_picker/panel/month_panel.rs
@@ -1,7 +1,7 @@
 use super::PanelVariant;
 use crate::{
     chrono::{Datelike, Month, Months, NaiveDate},
-    AiIcon, Button, ButtonSize, ButtonVariant,
+    Button, ButtonSize, ButtonVariant,
 };
 use leptos::*;
 
@@ -27,7 +27,7 @@ pub fn MonthPanel(
                 <Button
                     variant=ButtonVariant::Link
                     size=ButtonSize::Small
-                    icon=AiIcon::AiArrowLeftOutlined
+                    icon=icondata::AiArrowLeftOutlined
                     on_click=previous_year
                 />
                 <div class="thaw-date-picker-date-panel__header-year">
@@ -42,7 +42,7 @@ pub fn MonthPanel(
                 <Button
                     variant=ButtonVariant::Link
                     size=ButtonSize::Small
-                    icon=AiIcon::AiArrowRightOutlined
+                    icon=icondata::AiArrowRightOutlined
                     on_click=next_year
                 />
             </div>
diff --git a/thaw/src/date_picker/panel/year_panel.rs b/thaw/src/date_picker/panel/year_panel.rs
index dae8eb2..fb6de4a 100644
--- a/thaw/src/date_picker/panel/year_panel.rs
+++ b/thaw/src/date_picker/panel/year_panel.rs
@@ -1,7 +1,7 @@
 use super::PanelVariant;
 use crate::{
     chrono::{Datelike, NaiveDate},
-    AiIcon, Button, ButtonSize, ButtonVariant,
+    Button, ButtonSize, ButtonVariant,
 };
 use leptos::*;
 
@@ -34,7 +34,7 @@ pub fn YearPanel(
                 <Button
                     variant=ButtonVariant::Link
                     size=ButtonSize::Small
-                    icon=AiIcon::AiArrowLeftOutlined
+                    icon=icondata::AiArrowLeftOutlined
                     on_click=previous_year_range
                 />
                 <div>
@@ -47,7 +47,7 @@ pub fn YearPanel(
                 <Button
                     variant=ButtonVariant::Link
                     size=ButtonSize::Small
-                    icon=AiIcon::AiArrowRightOutlined
+                    icon=icondata::AiArrowRightOutlined
                     on_click=next_year_range
                 />
             </div>
diff --git a/thaw/src/icon/mod.rs b/thaw/src/icon/mod.rs
index a1d28fb..a11bb11 100644
--- a/thaw/src/icon/mod.rs
+++ b/thaw/src/icon/mod.rs
@@ -1,6 +1,6 @@
 // copy https://github.com/Carlosted/leptos-icons
 // leptos updated version causes leptos_icons error
-pub(crate) use icondata::*;
+pub(crate) use icondata::Icon;
 use leptos::*;
 
 /// The Icon component.
@@ -22,10 +22,8 @@ pub fn Icon(
     #[prop(into, optional)]
     style: Option<MaybeSignal<String>>,
 ) -> impl IntoView {
-    let icon = move || icondata_core::IconData::from(icon.get());
-
     let svg = move || {
-        let icon = icon();
+        let icon = icon.get();
         let mut svg = svg::svg();
         if let Some(classes) = class.clone() {
             svg = svg.classes(classes.get());
diff --git a/thaw/src/input_number/mod.rs b/thaw/src/input_number/mod.rs
index 82a3a06..ef2e55e 100644
--- a/thaw/src/input_number/mod.rs
+++ b/thaw/src/input_number/mod.rs
@@ -1,5 +1,5 @@
 use crate::utils::StoredMaybeSignal;
-use crate::{AiIcon, Button, ButtonVariant, ComponentRef, Icon, Input, InputRef, InputSuffix};
+use crate::{Button, ButtonVariant, ComponentRef, Icon, Input, InputRef, InputSuffix};
 use leptos::*;
 use std::ops::{Add, Sub};
 use std::str::FromStr;
@@ -67,10 +67,10 @@ where
         >
             <InputSuffix slot>
                 <Button disabled variant=ButtonVariant::Link on_click=sub>
-                    <Icon icon=Icon::from(AiIcon::AiMinusOutlined) style="font-size: 18px"/>
+                    <Icon icon=icondata::AiMinusOutlined style="font-size: 18px"/>
                 </Button>
                 <Button disabled variant=ButtonVariant::Link on_click=add>
-                    <Icon icon=Icon::from(AiIcon::AiPlusOutlined) style="font-size: 18px"/>
+                    <Icon icon=icondata::AiPlusOutlined style="font-size: 18px"/>
                 </Button>
             </InputSuffix>
         </Input>
diff --git a/thaw/src/message/mod.rs b/thaw/src/message/mod.rs
index 1ea50ee..02cc741 100644
--- a/thaw/src/message/mod.rs
+++ b/thaw/src/message/mod.rs
@@ -3,7 +3,6 @@ mod message_provider;
 mod theme;
 
 use crate::{theme::use_theme, Icon, Theme, components::{If, Then}};
-use icondata::*;
 use leptos::*;
 use uuid::Uuid;
 pub use message_provider::*;
@@ -20,9 +19,9 @@ pub enum MessageVariant {
 impl MessageVariant {
     fn icon(&self) -> Icon {
         match self {
-            MessageVariant::Success => icondata::Icon::Ai(AiCloseCircleFilled),
-            MessageVariant::Warning => icondata::Icon::Ai(AiExclamationCircleFilled),
-            MessageVariant::Error => icondata::Icon::Ai(AiCheckCircleFilled),
+            MessageVariant::Success => icondata::AiCloseCircleFilled,
+            MessageVariant::Warning => icondata::AiExclamationCircleFilled,
+            MessageVariant::Error => icondata::AiCheckCircleFilled,
         }
     }
     fn theme_color(&self, theme: &Theme) -> String {
@@ -64,7 +63,7 @@ pub(crate) fn Message(
                 <If cond=closable>
                     <Then slot>
                         <div class="thaw-message__close"  on:click=move |_| on_close.call(id)>
-                            <Icon icon=icondata::Icon::Ai(AiCloseOutlined)/>
+                            <Icon icon=icondata::AiCloseOutlined/>
                         </div>
                     </Then>
                 </If>
diff --git a/thaw/src/mobile/nav_bar/mod.rs b/thaw/src/mobile/nav_bar/mod.rs
index f28a431..163eee4 100644
--- a/thaw/src/mobile/nav_bar/mod.rs
+++ b/thaw/src/mobile/nav_bar/mod.rs
@@ -78,7 +78,7 @@ pub fn NavBar(
                                 <div class="thaw-nav-bar__left" on:click=on_click_left>
                                     <If cond=left_arrow>
                                         <Then slot>
-                                            <Icon icon=Icon::from(AiIcon::AiLeftOutlined)/>
+                                            <Icon icon=icondata::AiLeftOutlined/>
                                         </Then>
                                     </If>
                                     {move || left_text.get()}
diff --git a/thaw/src/modal/mod.rs b/thaw/src/modal/mod.rs
index 6daa285..f679931 100644
--- a/thaw/src/modal/mod.rs
+++ b/thaw/src/modal/mod.rs
@@ -35,7 +35,7 @@ pub fn Modal(
                         </CardHeader>
                         <CardHeaderExtra slot>
                             <span style="cursor: pointer;" on:click=move |_| show.set(false)>
-                                <Icon icon=Icon::from(AiIcon::AiCloseOutlined)/>
+                                <Icon icon=icondata::AiCloseOutlined/>
                             </span>
                         </CardHeaderExtra>
                         {children()}
diff --git a/thaw/src/time_picker/mod.rs b/thaw/src/time_picker/mod.rs
index fb80152..5350d54 100644
--- a/thaw/src/time_picker/mod.rs
+++ b/thaw/src/time_picker/mod.rs
@@ -5,7 +5,7 @@ use crate::{
     components::{Binder, Follower, FollowerPlacement},
     use_theme,
     utils::{mount_style, ComponentRef},
-    AiIcon, Button, ButtonSize, ButtonVariant, Icon, Input, InputSuffix, SignalWatch, Theme,
+    Button, ButtonSize, ButtonVariant, Icon, Input, InputSuffix, SignalWatch, Theme,
 };
 use leptos::*;
 pub use theme::TimePickerTheme;
@@ -77,7 +77,7 @@ pub fn TimePicker(
                 <Input attrs class value=show_time_text on_focus=open_panel on_blur=on_input_blur>
                     <InputSuffix slot>
                         <Icon
-                            icon=Icon::from(AiIcon::AiClockCircleOutlined)
+                            icon=icondata::AiClockCircleOutlined
                             style="font-size: 18px"
                         />
                     </InputSuffix>