diff --git a/web/README.md b/web/README.md
index 55ba947b..efb83042 100644
--- a/web/README.md
+++ b/web/README.md
@@ -1,12 +1,29 @@
-# 🦌 Deer Web UI
+# 🦌 DeerFlow Web UI
 
 [![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg)](https://opensource.org/licenses/MIT)
 
 > Come from Open Source, Back to Open Source
 
-This is the web UI project for [`deer`](https://github.com/bytedance/deer).
+This is the web UI project for [`DeerFlow`](https://github.com/bytedance/deer-flow).
+
+[`DeerFlow`](https://github.com/bytedance/deer-flow) is a community-driven AI automation framework that builds upon the incredible work of the open source community. Our goal is to combine language models with specialized tools for tasks like web search, crawling, and Python code execution, while giving back to the community that made this possible.
+
+## How to Install
+
+DeerFlow Web UI uses `pnpm` as package manager.
+
+```bash
+pnpm install
+```
+
+## How to Run in Development Mode
+
+```bash
+pnpm dev
+```
+
+By default, the web UI will be available at `http://localhost:3000`.
 
-[`Deer`](https://github.com/bytedance/deer) is a community-driven AI automation framework that builds upon the incredible work of the open source community. Our goal is to combine language models with specialized tools for tasks like web search, crawling, and Python code execution, while giving back to the community that made this possible.
 
 ## License
 
@@ -14,7 +31,7 @@ This project is open source and available under the [MIT License](LICENSE).
 
 ## Acknowledgments
 
-Special thanks to all the open source projects and contributors that make `Deer` possible. We stand on the shoulders of giants.
+Special thanks to all the open source projects and contributors that make `DeerFlow` possible. We stand on the shoulders of giants.
 
 In particular, we want to express our deep appreciation for:
 * [Next.js](https://nextjs.org/) for their exceptional framework
@@ -22,5 +39,6 @@ In particular, we want to express our deep appreciation for:
 * [Zustand](https://zustand.docs.pmnd.rs/) for their stunning state management
 * [Framer Motion](https://www.framer.com/motion/) for their amazing animation library
 * [React Markdown](https://www.npmjs.com/package/react-markdown) for their exceptional markdown rendering and customizability
+* Last but not least, special thanks to [SToneX](https://github.com/stonexer) for his great contribution for **[token-by-token visual effect](./src/core/rehype/rehype-split-words-into-spans.ts)**
 
-These amazing projects form the foundation of `Deer` and demonstrate the power of open source collaboration.
+These amazing projects form the foundation of `DeerFlow` and demonstrate the power of open source collaboration.
diff --git a/web/package.json b/web/package.json
index 4b51982e..1281439a 100644
--- a/web/package.json
+++ b/web/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "deer-web",
+  "name": "deer-flow-web",
   "version": "0.1.0",
   "private": true,
   "type": "module",
diff --git a/web/src/app/_components/logo.tsx b/web/src/app/_components/logo.tsx
index 82f6a70d..06a61e5f 100644
--- a/web/src/app/_components/logo.tsx
+++ b/web/src/app/_components/logo.tsx
@@ -6,16 +6,18 @@ import { useState } from "react";
 import { Markdown } from "./markdown";
 
 export function Logo() {
-  const [text, setText] = useState("🦌 Deer");
+  const [text, setText] = useState("🦌 DeerFlow");
   return (
     <a
       className="text-sm opacity-70 transition-opacity duration-300 hover:opacity-100"
       target="_blank"
-      href="https://github.com/bytedance/deer"
+      href="https://github.com/bytedance/deer-flow"
       onMouseEnter={() =>
-        setText("🦌 **D**eep **E**xploration and **E**fficient **R**esearch")
+        setText(
+          "🦌 **D**eep **E**xploration and **E**fficient **R**esearch Flow",
+        )
       }
-      onMouseLeave={() => setText("🦌 Deer")}
+      onMouseLeave={() => setText("🦌 DeerFlow")}
     >
       <Markdown animate>{text}</Markdown>
     </a>
diff --git a/web/src/app/_components/welcome.tsx b/web/src/app/_components/welcome.tsx
index 59e2e1b7..15432a73 100644
--- a/web/src/app/_components/welcome.tsx
+++ b/web/src/app/_components/welcome.tsx
@@ -19,12 +19,12 @@ export function Welcome({ className }: { className?: string }) {
       <div className="px-4 text-center text-lg text-gray-400">
         Welcome to{" "}
         <a
-          href="https://github.com/bytedance/deer"
+          href="https://github.com/bytedance/deer-flow"
           target="_blank"
           rel="noopener noreferrer"
           className="hover:underline"
         >
-          🦌 Deer
+          🦌 DeerFlow
         </a>
         , a research tool built on cutting-edge language models, helps you
         search on web, browse information, and handle complex tasks.
diff --git a/web/src/app/layout.tsx b/web/src/app/layout.tsx
index 8db8f2ba..2e73269c 100644
--- a/web/src/app/layout.tsx
+++ b/web/src/app/layout.tsx
@@ -9,7 +9,7 @@ import { Geist } from "next/font/google";
 import { TooltipProvider } from "~/components/ui/tooltip";
 
 export const metadata: Metadata = {
-  title: "🦌 Deer",
+  title: "🦌 DeerFlow",
   description:
     "Deep Exploration and Efficient Research, an AI tool that combines language models with specialized tools for research tasks.",
   icons: [{ rel: "icon", url: "/favicon.ico" }],
diff --git a/web/src/app/page.tsx b/web/src/app/page.tsx
index 46703320..5f502955 100644
--- a/web/src/app/page.tsx
+++ b/web/src/app/page.tsx
@@ -31,7 +31,7 @@ export default function HomePage() {
           size="icon"
           asChild
         >
-          <Link href="https://github.com/bytedance/deer" target="_blank">
+          <Link href="https://github.com/bytedance/deer-flow" target="_blank">
             <GithubOutlined />
           </Link>
         </Button>