diff --git a/src/ui/components/chat_panel.rs b/src/ui/components/chat_panel.rs
new file mode 100644
index 0000000..0ba0b6c
--- /dev/null
+++ b/src/ui/components/chat_panel.rs
@@ -0,0 +1,18 @@
+use dioxus::prelude::*;
+
+turf::style_sheet!("src/ui/components/chat_panel.scss");
+
+#[component]
+pub fn ChatPanel(name: String) -> Element {
+    rsx! {
+        style { {STYLE_SHEET} },
+
+        div {
+            class: ClassName::CHAT_PANEL,
+
+            div {
+                {name}
+            }
+        }
+    }
+}
diff --git a/src/ui/components/chat_panel.scss b/src/ui/components/chat_panel.scss
new file mode 100644
index 0000000..ce05d8a
--- /dev/null
+++ b/src/ui/components/chat_panel.scss
@@ -0,0 +1,6 @@
+@import "../_base.scss";
+@import "./_panel.scss";
+
+.chat-panel {
+    @include panel();
+}