diff --git a/public/locales/en/common.json b/public/locales/en/common.json
index f625041f..e0436779 100644
--- a/public/locales/en/common.json
+++ b/public/locales/en/common.json
@@ -6,6 +6,7 @@
   "setting": "Setting",
   "more": "More",
   "action": {
+    "login": "Sign In",
     "logout": "Log Out",
     "change_avatar": "Change Avatar",
     "cancel": "Cancel",
diff --git a/public/locales/en/welcome.json b/public/locales/en/welcome.json
index 25bd8edd..b2241544 100644
--- a/public/locales/en/welcome.json
+++ b/public/locales/en/welcome.json
@@ -6,6 +6,7 @@
   "start_by_dm": "Send a Direct Message",
   "download": "Download Mobile apps",
   "help": "Got questions? Visit our help center",
+  "sign_in_tip": "Please sign in to send message",
   "onboarding": {
     "title": "VoceChat Setup",
     "welcome": "Welcome to your VoceChat!",
diff --git a/public/locales/jp/common.json b/public/locales/jp/common.json
index f0eb3288..3b0eeb4a 100644
--- a/public/locales/jp/common.json
+++ b/public/locales/jp/common.json
@@ -6,6 +6,8 @@
   "setting": "設定",
   "more": "もっと",
   "action": {
+    "login": "Sign In",
+
     "logout": "ログアウト",
     "change_avatar": "アバターを変更",
     "cancel": "キャンセル",
diff --git a/public/locales/jp/welcome.json b/public/locales/jp/welcome.json
index e8bbdf2a..96cdf957 100644
--- a/public/locales/jp/welcome.json
+++ b/public/locales/jp/welcome.json
@@ -6,6 +6,7 @@
   "start_by_dm": "チャットしましょう",
   "download": "アプリをダウンロードしましょう",
   "help": "まだ聞きたいことがある？ ヘルプにアクセスしましょう",
+  "sign_in_tip": "Please sign in to send message",
   "onboarding": {
     "title": "VoceChat初期化",
     "welcome": "あなたのVoceChatへようこそ！",
diff --git a/public/locales/zh/common.json b/public/locales/zh/common.json
index cee47173..5f8c53a8 100644
--- a/public/locales/zh/common.json
+++ b/public/locales/zh/common.json
@@ -6,6 +6,8 @@
   "setting": "设置",
   "more": "更多",
   "action": {
+    "login": "登录",
+
     "logout": "退出登录",
     "change_avatar": "修改头像",
     "cancel": "取消",
diff --git a/public/locales/zh/welcome.json b/public/locales/zh/welcome.json
index 5131bc19..2dc517b0 100644
--- a/public/locales/zh/welcome.json
+++ b/public/locales/zh/welcome.json
@@ -6,6 +6,7 @@
   "start_by_dm": "找人聊天",
   "download": "下载移动端APP",
   "help": "还有问题？访问我们的帮助中心",
+  "sign_in_tip": "请登录后发消息",
   "onboarding": {
     "title": "VoceChat初始化",
     "welcome": "欢迎来到你的VoceChat！",
diff --git a/src/routes/chat/GuestChannelChatInfo/index.tsx b/src/routes/chat/GuestChannelChatInfo/index.tsx
index 511e3f44..4e812411 100644
--- a/src/routes/chat/GuestChannelChatInfo/index.tsx
+++ b/src/routes/chat/GuestChannelChatInfo/index.tsx
@@ -7,10 +7,12 @@ import { renderMessageFragment } from "../utils";
 import { StyledChannelChat, StyledHeader } from "./styled";
 import LoadMore from "../LoadMore";
 import { useAppSelector } from "../../../app/store";
+import { useTranslation } from "react-i18next";
 type Props = {
   cid?: number;
 };
 export default function GuestChannelChat({ cid = 0 }: Props) {
+  const { t } = useTranslation("chat");
   const {
     list: msgIds,
     appends,
@@ -51,8 +53,8 @@ export default function GuestChannelChat({ cid = 0 }: Props) {
             <LoadMore pullUp={pullUp} />
           ) : (
             <div className="info">
-              <h2 className="title">Welcome to #{name} !</h2>
-              <p className="desc">This is the start of the #{name} channel. </p>
+              <h2 className="title">{t("welcome_channel", { name })}</h2>
+              <p className="desc">{t("welcome_desc", { name })} </p>
             </div>
           )}
           {/* <div className="feed"> */}
diff --git a/src/routes/chat/Layout/LoginTip.tsx b/src/routes/chat/Layout/LoginTip.tsx
index f2e8bc51..3bad810b 100644
--- a/src/routes/chat/Layout/LoginTip.tsx
+++ b/src/routes/chat/Layout/LoginTip.tsx
@@ -1,33 +1,15 @@
 // import { useEffect } from "react";
+import { useTranslation } from "react-i18next";
 import { useDispatch } from "react-redux";
 import { useNavigate } from "react-router-dom";
-import styled from "styled-components";
 import { resetAuthData } from "../../../app/slices/auth.data";
 import Button from "../../../common/component/styled/Button";
 import useLogout from "../../../common/hook/useLogout";
-const Styled = styled.div`
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  background: #e5e7eb;
-  border-radius: var(--br);
-  width: 100%;
-  width: -webkit-fill-available;
-  padding: 16px 18px;
-  .txt {
-    font-weight: 500;
-    font-size: 14px;
-    line-height: 20px;
-    color: #98a2b3;
-    .hand {
-      font-size: 20px;
-      margin-right: 10px;
-    }
-  }
-`;
 // type Props = {};
 
 const LoginTip = () => {
+  const { t } = useTranslation("welcome");
+  const { t: ct } = useTranslation();
   const dispatch = useDispatch();
   const { clearLocalData } = useLogout();
   const navigateTo = useNavigate();
@@ -38,13 +20,13 @@ const LoginTip = () => {
   };
 
   return (
-    <Styled>
-      <span className="txt">
-        <i className="hand">👋</i>
-        Please sign in to send message
+    <div className="flex items-center justify-between bg-slate-200/80 rounded-lg w-full p-4">
+      <span className="text-base text-[#98a2b3]">
+        <i className="mr-2 text-lg">👋</i>
+        {t("sign_in_tip")}
       </span>
-      <Button onClick={handleSignIn} className="small">{`Sign In`}</Button>
-    </Styled>
+      <Button onClick={handleSignIn} className="small">{ct("action.login")}</Button>
+    </div>
   );
 };