diff --git a/layouts/nav/nav.tsx b/layouts/nav/nav.tsx
index 070100d7..454fef10 100644
--- a/layouts/nav/nav.tsx
+++ b/layouts/nav/nav.tsx
@@ -21,20 +21,8 @@ import { ReserveUrls } from "src/data/reserve-urls"
 import Link from "next/link"
 import DarkMode from "components/dark-mode"
 import AccountMenu from "components/user-menu"
-
-const navLinks = [{
-  title: '主页',
-  url: '/',
-},
-{
-  title: '标签',
-  url: ReserveUrls.Tags,
-},
-{
-  title: '学习资料',
-  url: ReserveUrls.Courses,
-},
-]
+import { navLinks } from "src/data/links"
+import { getSvgIcon } from "components/svg-icon"
 
 
 function HeaderContent() {
@@ -75,6 +63,7 @@ function HeaderContent() {
           maxW="600px"
           align="center"
           color={useColorModeValue("gray.500", "gray.400")}
+          spacing="1"
         >
           {/* <AlgoliaSearch />  */}
           <Link
@@ -92,6 +81,18 @@ function HeaderContent() {
               icon={<FaGithub />}
             />
           </Link>
+          <Link
+            aria-label="Go to Chakra UI GitHub page"
+            href={`${ReserveUrls.Search}/posts`}
+          >
+            <IconButton
+              aria-label="go to github"
+              variant="ghost"
+              color="current"
+              _focus={null}
+              icon={getSvgIcon("search")}
+            />
+          </Link>
           <DarkMode />
           <AccountMenu />
           {/* <MobileNavButton
diff --git a/layouts/nav/post-nav.tsx b/layouts/nav/post-nav.tsx
index 3dafc945..e2388e71 100644
--- a/layouts/nav/post-nav.tsx
+++ b/layouts/nav/post-nav.tsx
@@ -9,7 +9,8 @@ import {
     Heading,
     Button,
     Divider,
-    Text
+    Text,
+    Tooltip
 } from "@chakra-ui/react"
 import { useViewportScroll } from "framer-motion"
 import React, { useEffect, useState } from "react"
@@ -20,14 +21,18 @@ import { FaGithub, FaTwitter, FaUserPlus } from "react-icons/fa"
 import Follow from "components/interaction/follow"
 import { requestApi } from "utils/axios/request"
 import { Post } from "src/types/posts"
+import { getSvgIcon } from "components/svg-icon"
+import Link from "next/link"
+import Logo from "components/logo"
+import { ReserveUrls } from "src/data/reserve-urls"
 
 
 interface Props {
     post: Post
 }
 
-function PostNav(props:Props) {
-    const {post} = props
+function PostNav(props: Props) {
+    const { post } = props
     const [followed, setFollowed] = useState(null)
 
     useEffect(() => {
@@ -48,59 +53,33 @@ function PostNav(props:Props) {
         >
             <chakra.div height="4.5rem" mx="auto" maxW="1200px">
                 <Flex w="100%" h="100%" align="center" justify="space-between" px={{ base: "4", md: "6" }}>
-                    <HStack spacing="2">
-                        <Heading size="md">Sunface的博客</Heading>
-                        {followed !== null && <Follow targetID={post?.creator.id} followed={followed} />}
-                    </HStack>
 
+                    <Logo width="130" />
 
                     <HStack
                         color={useColorModeValue("gray.500", "gray.400")}
                         spacing={[1, 1, 2, 2]}
                     >
-                        <IconButton
-                            size="md"
-                            fontSize="lg"
-                            variant="ghost"
-                            color="current"
-                            _focus={null}
-                            onClick={() => alert('search in this blog')}
-                            icon={<SearchIcon />}
-                            aria-label="search in this blog"
-                        />
+                        <Tooltip label="back to home" openDelay={300}>
+                            <Link href={`${ReserveUrls.Search}/posts`}>
+                                <IconButton
+                                    size="md"
+                                    fontSize="lg"
+                                    variant="ghost"
+                                    color="current"
+                                    _focus={null}
+                                    icon={getSvgIcon("search")}
+                                    aria-label="search in this blog"
+                                />
+                            </Link>
+                        </Tooltip>
                         <DarkMode />
                         <AccountMenu />
                     </HStack>
                 </Flex>
                 <Flex w="100%" align="center" justify="space-between" px={{ base: "6", md: "10" }} mt="2">
-                    <HStack spacing="4">
-                        <Text fontSize="1.1rem" fontWeight="600">Home</Text>
-                        <Text fontSize="1.1rem">Badges</Text>
-                    </HStack>
-
-                    <HStack
-                        color={useColorModeValue("gray.500", "gray.400")}
-                        spacing="2"
-                    >
-                        <IconButton
-                            size="md"
-                            fontSize="1.2rem"
-                            aria-label="go to github"
-                            variant="ghost"
-                            color="current"
-                            _focus={null}
-                            icon={<FaGithub />}
-                        />
-                        <IconButton
-                            size="md"
-                            fontSize="1.2rem"
-                            aria-label="go to twitter"
-                            variant="ghost"
-                            color="current"
-                            _focus={null}
-                            icon={<FaTwitter />}
-                        />
-                    </HStack>
+                    <Link href={`/${post.creator.username}`}><Heading size="md" cursor="pointer" mr="1" zIndex="1">{post.creator.nickname}的博客</Heading></Link>
+                    {followed !== null && <Follow targetID={post?.creator.id} followed={followed} />}
                 </Flex>
                 <Divider mt="2" />
             </chakra.div>
diff --git a/layouts/nav/vertical-nav.tsx b/layouts/nav/vertical-nav.tsx
index a540fe28..71f8797a 100644
--- a/layouts/nav/vertical-nav.tsx
+++ b/layouts/nav/vertical-nav.tsx
@@ -25,24 +25,9 @@ import {
   import DarkMode from "components/dark-mode"
   import AccountMenu from "components/user-menu"
 import { getSvgIcon } from "components/svg-icon"
+import { navLinks } from "src/data/links"
   
-  const navLinks = [{
-    title: '主页',
-    url: '/',
-    icon: getSvgIcon("home","1.4rem")
-  },
-  {
-    title: '标签',
-    url: ReserveUrls.Tags,
-    icon: getSvgIcon("tags","1.2rem")
-  },
-  {
-    title: '学习资料',
-    url: ReserveUrls.Courses,
-    icon: getSvgIcon("explore","1.4rem")
-  },
-  ]
-  
+
   
   function HeaderContent() {
     const router = useRouter()
@@ -55,7 +40,15 @@ import { getSvgIcon } from "components/svg-icon"
     useUpdateEffect(() => {
       mobileNavBtnRef.current?.focus()
     }, [mobileNav.isOpen])
-  
+    
+    const isActive = url => {
+      if (url === '/') {
+        return asPath === url
+      }
+
+      console.log(asPath,url)
+      return asPath.startsWith(url)
+    }
   
     return (
       <>
@@ -70,8 +63,8 @@ import { getSvgIcon } from "components/svg-icon"
             <VStack pt="6"  ml={{ base: 1, md: 4, lg: 12 }} fontSize="1rem" alignItems="left">
               {navLinks.map(link => 
                <Link href={link.url} key={link.title}>
-                  <HStack cursor="pointer" px="4" py="0.7rem" rounded="md" key={link.url} color={useColorModeValue("gray.700", "whiteAlpha.900")} aria-current={asPath === link.url ? "page" : undefined} _activeLink={{ bg: useColorModeValue("transparent", "rgba(48, 140, 122, 0.3)"), color: useColorModeValue("teal.500", "teal.200"), fontWeight: "bold", }} >
-                    <Box width="25px">{link.icon}</Box><Text>{link.title}</Text>
+                  <HStack cursor="pointer" px="4" py="0.7rem" rounded="md" key={link.url} color={useColorModeValue("gray.700", "whiteAlpha.900")} aria-current={isActive(link.baseUrl) ? "page" : undefined} _activeLink={{ bg: useColorModeValue("transparent", "rgba(48, 140, 122, 0.3)"), color: useColorModeValue("teal.500", "teal.200"), fontWeight: "bold", }} >
+                    <Box width="25px">{link.icon}</Box><Text fontWeight="600">{link.title}</Text>
                   </HStack>
                 </Link>
                 )}
@@ -83,15 +76,6 @@ import { getSvgIcon } from "components/svg-icon"
             align="center"
             color={useColorModeValue("gray.500", "gray.400")}
           >
-            <IconButton
-                fontSize="1.4rem"
-                aria-label="go to github"
-                variant="ghost"
-                color="current"
-                _focus={null}
-                icon={<FaSearch />}
-              />
-
             <Link
               aria-label="Go to Chakra UI GitHub page"
               href={siteConfig.repo.url}
diff --git a/layouts/sidebar/sidebar-link.tsx b/layouts/sidebar/sidebar-link.tsx
index 53a29295..38fdcb6e 100644
--- a/layouts/sidebar/sidebar-link.tsx
+++ b/layouts/sidebar/sidebar-link.tsx
@@ -28,7 +28,7 @@ const StyledLink = React.forwardRef(function StyledLink(
         fontWeight: "600",
       }}
       {...rest}
-    ><chakra.span mr="5" fontSize="1.1rem" display={{base:"none",md:"block"}}>{icon}</chakra.span> <chakra.span>{children}</chakra.span></chakra.a>
+    ><chakra.span mr="5" fontSize="1.1rem" display={{base:"none",md:"block"}} width="20px">{icon}</chakra.span> <chakra.span>{children}</chakra.span></chakra.a>
   )
 })
 
@@ -40,8 +40,8 @@ type SidebarLinkProps = PropsOf<typeof chakra.div> & {
 const SidebarLink = (props: SidebarLinkProps) => {
   const { href, icon, children, ...rest } = props
 
-  const { pathname } = useRouter()
-  const isActive = pathname === href
+  const { asPath } = useRouter()
+  const isActive = asPath.indexOf(href) > -1
 
   return (
     <chakra.div
diff --git a/layouts/sidebar/sidebar.tsx b/layouts/sidebar/sidebar.tsx
index 4209d70e..8e8cb3ad 100644
--- a/layouts/sidebar/sidebar.tsx
+++ b/layouts/sidebar/sidebar.tsx
@@ -28,7 +28,7 @@ const Sidebar = ({ routes, title, ...props }) => {
 
     return (
         <VStack alignItems="left" width={["180px","180px","250px","250px"]}  height="fit-content" >
-            <Card p="5"><Heading size="md">{title}</Heading></Card>
+            <Card p="5"><Heading size="md" fontSize="1.3rem">{title}</Heading></Card>
             <Card p="0" {...props}>
                 <Box
                     ref={ref}
diff --git a/next-redirect.js b/next-redirect.js
index f8dd012a..a0b19089 100644
--- a/next-redirect.js
+++ b/next-redirect.js
@@ -1,8 +1,8 @@
 async function redirect() {
     return [
       // {
-      //   source: "/discord",
-      //   destination: "https://discord.gg/dQHfcWF",
+      //   source: "/search",
+      //   destination: "/search/posts",
       //   permanent: true,
       // }
     ]
diff --git a/pages/[username]/[post_id].tsx b/pages/[username]/[post_id].tsx
index f38bd080..199f8176 100644
--- a/pages/[username]/[post_id].tsx
+++ b/pages/[username]/[post_id].tsx
@@ -70,7 +70,7 @@ const PostPage = () => {
             <Box width={["100%", "100%", "75%", "75%"]} height="fit-content" pl={[0, 0, "0%", "10%"]}>
               <Image src={post.cover} />
               <Box px="2">
-                <Heading size="xl" my="6" lineHeight="1.5">{post.title}</Heading>
+                <Heading size="lg" my="6" lineHeight="1.5">{post.title}</Heading>
 
                 <Divider my="4" />
                 <PostAuthor post={post} />
diff --git a/pages/[username]/index.tsx b/pages/[username]/index.tsx
index f7eb62a0..0f687ede 100644
--- a/pages/[username]/index.tsx
+++ b/pages/[username]/index.tsx
@@ -92,7 +92,7 @@ const UserPage = () => {
               <Box backgroundImage={`url(${user.cover})`} height="300px" width="100%" backgroundSize="cover" backgroundPosition="center" />
               <VStack maxHeight="200px" position="relative" top="-70px" spacing="3">
                 <Image src={user.avatar} height="130px" borderRadius="50%" border={`4px solid ${borderColor}`} />
-                <Heading fontSize="1.8rem">{user.nickname}</Heading>
+                <Heading size="lg">{user.nickname}</Heading>
                 {user.tagline && <Text layerStyle="textSecondary" fontWeight="450" fontSize="1.2rem" ml="1" mt="2">{user.tagline}</Text>}
                 <Flex layerStyle="textSecondary" spacing="2" pt="1" alignItems="center">
                   <chakra.span><FaHeart /></chakra.span><chakra.span ml="1">Followers <chakra.a fontWeight="600"><Count count={user.follows}/></chakra.a></chakra.span>
@@ -141,7 +141,7 @@ const UserPage = () => {
                   </Box>}
                 </Card>
                 {user.rawSkills.length > 0 && <Card>
-                  <Heading size="md" fontSize="1.2rem" layerStyle="textSecondary" fontWeight="500">擅长技能</Heading>
+                  <Heading size="sm" layerStyle="textSecondary" fontWeight="500">擅长技能</Heading>
                   <Wrap mt="4" p="1">
                     {
                       user.rawSkills.map(skill =>
@@ -156,7 +156,7 @@ const UserPage = () => {
                 </Card>}
 
                 {tags.length > 0 && <Card>
-                  <Heading size="md" fontSize="1.2rem"  layerStyle="textSecondary" fontWeight="500">博客标签</Heading>
+                  <Heading size="sm" layerStyle="textSecondary" fontWeight="500">博客标签</Heading>
                   <Wrap mt="4" p="1">
                     {
                       tags.map(tag =>
diff --git a/pages/bookmarks.tsx b/pages/bookmarks.tsx
index 084ac082..5d0e31f1 100644
--- a/pages/bookmarks.tsx
+++ b/pages/bookmarks.tsx
@@ -89,7 +89,7 @@ import Empty from "components/empty"
             <VStack alignItems="left" width={["100%", "100%", "70%", "70%"]} spacing="3">
               <Card>
                 <VStack py="3" spacing="3">
-                  <Heading size="md" fontSize="1.6rem">Bookmarks</Heading>
+                  <Heading size="md">Bookmarks</Heading>
                   <Text layerStyle="textSecondary">All the discussions, stories and comments you have bookmarked on {config.appName}.</Text>
                 </VStack>
               </Card>
diff --git a/pages/courses.tsx b/pages/courses.tsx
deleted file mode 100644
index 2b21f684..00000000
--- a/pages/courses.tsx
+++ /dev/null
@@ -1,24 +0,0 @@
-import { chakra } from "@chakra-ui/react"
-import Container from "components/container"
-import SEO from "components/seo"
-import siteConfig from "configs/site-config"
-import Nav from "layouts/nav/nav"
-import PageContainer from "layouts/page-container"
-import React from "react"
-
-const CoursesPage = () => (
-  <>
-    <SEO
-      title={siteConfig.seo.title}
-      description={siteConfig.seo.description}
-    />
-    <Nav />
-    <PageContainer>
-      <chakra.h1>Courses</chakra.h1>
-      <p>You just hit a route that doesn&#39;t exist... the sadness.</p>
-    </PageContainer>
-  </>
-)
-
-export default CoursesPage
-
diff --git a/pages/search/[type].tsx b/pages/search/[type].tsx
new file mode 100644
index 00000000..ecd627c5
--- /dev/null
+++ b/pages/search/[type].tsx
@@ -0,0 +1,42 @@
+import { Box, chakra, Flex, Input } from "@chakra-ui/react"
+import Card from "components/card"
+import Container from "components/container"
+import Empty from "components/empty"
+import SEO from "components/seo"
+import siteConfig from "configs/site-config"
+import PageContainer1 from "layouts/page-container1"
+import Sidebar from "layouts/sidebar/sidebar"
+import { useRouter } from "next/router"
+import React from "react"
+import { searchLinks } from "src/data/links"
+
+const CoursesPage = () => {
+    const router = useRouter()
+    const type = router.query.type
+
+    return (
+        <>
+            <SEO
+                title={siteConfig.seo.title}
+                description={siteConfig.seo.description}
+            />
+            <PageContainer1>
+                <Flex width="100%">
+                    <Sidebar routes={searchLinks} title="全站搜索" />
+                    <Box ml="3" width={['100%', '100%', '50%', '50%']}>
+                        <Card p="5">
+                            <Input size="lg" placeholder="type to search..." variant="unstyled" />
+                        </Card>
+                        <Card mt="2">
+                            <Empty />
+                        </Card>
+                    </Box>
+                </Flex>
+            </PageContainer1>
+        </>
+    )
+}
+
+export default CoursesPage
+
+
diff --git a/pages/settings/profile.tsx b/pages/settings/profile.tsx
index 12b6df0f..ae2a04de 100644
--- a/pages/settings/profile.tsx
+++ b/pages/settings/profile.tsx
@@ -118,7 +118,7 @@ const UserProfilePage = () => {
                                         <Layout spacing={isLargerThan1280 ? "8" : "6"} alignItems={isLargerThan1280 ? 'top' : 'left'}>
                                             <Box width="100%">
                                                 <VStack alignItems="left" spacing="6">
-                                                    <Heading fontSize="1.2rem">基本信息</Heading>
+                                                    <Heading size="sm">基本信息</Heading>
                                                     <Field name="nickname" validate={validateNickname}>
                                                         {({ field, form }) => (
                                                             <FormControl isInvalid={form.errors.nickname && form.touched.nickname} >
@@ -164,7 +164,7 @@ const UserProfilePage = () => {
                                                 </VStack>
 
                                                 <VStack alignItems="left" spacing="6" mt="6">
-                                                    <Heading fontSize="1.2rem">About You</Heading>
+                                                    <Heading size="sm">About You</Heading>
                                                     <Field name="tagline" validate={validateLen}>
                                                         {({ field, form }) => (
                                                             <FormControl isInvalid={form.errors.tagline && form.touched.tagline} >
@@ -213,7 +213,7 @@ const UserProfilePage = () => {
                                             </Box>
                                             <Box width="100%" >
                                                 <VStack alignItems="left" spacing="6">
-                                                    <Heading fontSize="1.2rem">社交媒体</Heading>
+                                                    <Heading size="sm">社交媒体</Heading>
                                                     <Field name="website" validate={validateUrl}>
                                                         {({ field, form }) => (
                                                             <FormControl isInvalid={form.errors.website && form.touched.website} >
diff --git a/pages/tags/index.tsx b/pages/tags/index.tsx
index ae4ffc9d..0a2b6525 100644
--- a/pages/tags/index.tsx
+++ b/pages/tags/index.tsx
@@ -58,7 +58,7 @@ const TagsPage = () => {
           <VStack alignItems="left" width={["100%", "100%", "70%", "70%"]} spacing="3">
             <Card>
               <VStack py="3" spacing="3">
-                <Heading size="md" fontSize="1.6rem">Tags On {config.appName}</Heading>
+                <Heading size="md">Tags On {config.appName}</Heading>
                 <Text layerStyle="textSecondary">Join communities on {config.appName}. Follow tags that interest you.</Text>
               </VStack>
             </Card>
diff --git a/server/pkg/common/reserve_urls.go b/server/pkg/common/reserve_urls.go
index 8dc65c13..85e0a813 100644
--- a/server/pkg/common/reserve_urls.go
+++ b/server/pkg/common/reserve_urls.go
@@ -2,5 +2,17 @@ package common
 
 // 需要同时修改ui/src/data/reserve-urls.ts
 var ReserverURLs = []string{
-	"/tags", "/courses", "/editor", "/admin", "/bookmarks", "/settings", "/jobs", "/books", "/notifications", "/sponsors", "/explore", "/login",
+	"/tags",
+	"/courses",
+	"/editor",
+	"/admin",
+	"/bookmarks",
+	"/settings",
+	"/jobs",
+	"/books",
+	"/notifications",
+	"/sponsors",
+	"/explore",
+	"/login",
+	"/search",
 }
diff --git a/src/components/comments/comment.tsx b/src/components/comments/comment.tsx
index 36460547..3e976630 100644
--- a/src/components/comments/comment.tsx
+++ b/src/components/comments/comment.tsx
@@ -50,7 +50,7 @@ export const CommentCard = (props: Props) => {
                                 <HStack spacing="4" cursor="pointer">
                                     <Avatar src={comment.creator.avatar}></Avatar>
                                     <VStack alignItems="left">
-                                        <Heading size="sm" fontSize="1.2rem">{getUserName(comment.creator)}</Heading>
+                                        <Heading size="sm">{getUserName(comment.creator)}</Heading>
                                         <Text layerStyle="textSecondary" fontSize=".9rem">about this user</Text>
                                     </VStack>
                                 </HStack>
diff --git a/src/components/comments/reply.tsx b/src/components/comments/reply.tsx
index 4f92bbae..90d67b13 100644
--- a/src/components/comments/reply.tsx
+++ b/src/components/comments/reply.tsx
@@ -66,7 +66,7 @@ export const Reply = (props: Props) => {
                                 <HStack spacing="4" cursor="pointer">
                                     <Avatar src={comment.creator.avatar} width="40px" height="40px"></Avatar>
                                     <VStack alignItems="left">
-                                        <Heading size="sm" fontSize="1.1rem">{getUserName(comment.creator)}</Heading>
+                                        <Heading size="sm">{getUserName(comment.creator)}</Heading>
                                     </VStack>
                                 </HStack>
                             </Link>
diff --git a/src/components/logo.tsx b/src/components/logo.tsx
index aa73ce4f..fc7af1a1 100644
--- a/src/components/logo.tsx
+++ b/src/components/logo.tsx
@@ -1,31 +1,37 @@
-import { HTMLChakraProps, useColorModeValue } from "@chakra-ui/react"
+import { Box, HTMLChakraProps, useColorModeValue } from "@chakra-ui/react"
+import Link from "next/link"
 import React from "react"
 
 export const Logo = (props) => {
     const fill = useColorModeValue("#151618", "#fff")
 
     return (
-        <>
-        <svg viewBox="0 0 114 20" width={props.width} xmlns="http://www.w3.org/2000/svg">
-            \<g fill={fill} fillRule="evenodd" id="svg_1"><g fillRule="nonzero" id="svg_2"><path d="M30.6276,9.99306L26.69038,6.0476L28.65797,2.10352L35.05517,8.51411C35.87026,9.33091 35.87026,10.65521 35.05517,11.472L27.18143,19.36223C26.36633,20.17903 25.04481,20.17903 24.22971,19.36223C23.41462,18.54543 23.41462,17.22114 24.22971,16.40434L30.6276,9.99306z" opacity=".56" id="svg_3"></path><path d="M24.23118,0.61615C25.04627,-0.20065 26.36814,-0.20031 27.18323,0.61649L28.65943,2.09578L11.43678,19.3545C10.62168,20.1713 9.29981,20.17096 8.48472,19.35416L7.00852,17.87487L24.23118,0.61615zM16.84984,6.04055L13.89745,8.99913L9.96023,5.05368L5.03889,9.98533L8.9761,13.93078L7.00852,17.87487L0.61132,11.46427C-0.20377,10.64747 -0.20377,9.32318 0.61132,8.50638L8.48472,0.61649C9.29981,-0.20031 10.62168,-0.20065 11.43678,0.61615L16.84984,6.04055z" id="svg_4"></path></g><path d="M69.9619,17.85659 L69.9619,16.278309999999998 L68.34275,16.278309999999998 L68.34275,17.85659 L69.9619,17.85659 zM74.80461,17.95985 C75.58965,17.95985 76.25448,17.76318 76.7991,17.36983 C77.34373,16.97649 77.72398,16.450400000000002 77.93987,15.791549999999999 L77.93987,17.85659 L79.27934,17.85659 L79.27934,6.9413599999999995 L77.93987,6.9413599999999995 L77.93987,11.82371 C77.72398,11.16487 77.34373,10.638770000000001 76.7991,10.24543 S75.58965,9.65542 74.80461,9.65542 C74.08826,9.65542 73.45042,9.82259 72.89108,10.156930000000001 S71.8926,10.97311 71.57368,11.60246 C71.25476,12.23181 71.0953,12.96932 71.0953,13.815010000000001 S71.25476,15.39575 71.57368,16.02018 C71.8926,16.64461 72.33174,17.12399 72.89108,17.45834 S74.08826,17.95985 74.80461,17.95985 zM75.18732,16.77982 C74.36303,16.77982 73.7031,16.51677 73.20755,15.99068 C72.71199,15.46458 72.46421,14.73936 72.46421,13.815010000000001 S72.71199,12.16543 73.20755,11.63933 C73.7031,11.11324 74.36303,10.85019 75.18732,10.85019 C75.71722,10.85019 76.1907,10.97065 76.60775,11.21157 C77.0248,11.4525 77.35109,11.79913 77.5866,12.25147 C77.82211,12.70382 77.93987,13.22499 77.93987,13.815010000000001 S77.82211,14.92374 77.5866,15.37117 C77.35109,15.81859 77.0248,16.165219999999998 76.60775,16.41106 C76.1907,16.6569 75.71722,16.77982 75.18732,16.77982 zM84.99051,17.95985 C85.66761,17.95985 86.27601,17.836930000000002 86.81573,17.59109 C87.35544,17.34525 87.79457,17.00108 88.13312,16.55857 S88.69001,15.61455 88.78814,15.05403 L87.36035,15.05403 C87.26222,15.60471 86.99481,16.04476 86.55814,16.37419 C86.12146,16.703609999999998 85.57929,16.86832 84.93163,16.86832 C84.21528,16.86832 83.60933,16.637230000000002 83.11377,16.175060000000002 S82.35572,15.01962 82.32628,14.09526 L88.78814,14.09526 C88.82739,13.88876 88.84702,13.64292 88.84702,13.35775 C88.84702,12.67923 88.69246,12.05972 88.38335,11.49921 C88.07424,10.93869 87.62775,10.49127 87.04388,10.156930000000001 C86.46001,9.82259 85.77555,9.65542 84.99051,9.65542 C84.21528,9.65542 83.52837,9.82259 82.92978,10.156930000000001 S81.86261,10.97311 81.52407,11.60246 C81.18552,12.23181 81.01624,12.96932 81.01624,13.815010000000001 S81.18552,15.39575 81.52407,16.02018 C81.86261,16.64461 82.33118,17.12399 82.92978,17.45834 S84.21528,17.95985 84.99051,17.95985 zM87.49282,13.44625 L82.32628,13.44625 C82.36553,12.56123 82.63539,11.89009 83.13585,11.43283 C83.63631,10.97557 84.25453,10.74694 84.99051,10.74694 C85.45172,10.74694 85.87859,10.84528 86.27111,11.04195 C86.66363,11.23862 86.97274,11.53854 87.19843,11.94172 C87.42413,12.34489 87.52226,12.8464 87.49282,13.44625 zM94.51403,17.85659 L97.67872,9.75867 L96.23621,9.75867 L93.73389,16.42581 L91.20214,9.75867 L89.75963,9.75867 L92.92432,17.85659 L94.51403,17.85659 z" fillRule="nonzero" opacity=".56" id="svg_6" strokeDasharray="none"></path><text fill={fill} stroke="null" strokeWidth="0" strokeOpacity="null" fillOpacity="null"  x="39.5" y="18.453125" id="svg_7" fontSize="25" fontFamily="sans-serif" textAnchor="start"  strokeDasharray="none">im</text></g>
-        </svg>
-        </>
+        <Link href="/">
+            <Box cursor="pointer">
+                <svg viewBox="0 0 114 20" width={props.width} xmlns="http://www.w3.org/2000/svg">
+                    \<g fill={fill} fillRule="evenodd" id="svg_1"><g fillRule="nonzero" id="svg_2"><path d="M30.6276,9.99306L26.69038,6.0476L28.65797,2.10352L35.05517,8.51411C35.87026,9.33091 35.87026,10.65521 35.05517,11.472L27.18143,19.36223C26.36633,20.17903 25.04481,20.17903 24.22971,19.36223C23.41462,18.54543 23.41462,17.22114 24.22971,16.40434L30.6276,9.99306z" opacity=".56" id="svg_3"></path><path d="M24.23118,0.61615C25.04627,-0.20065 26.36814,-0.20031 27.18323,0.61649L28.65943,2.09578L11.43678,19.3545C10.62168,20.1713 9.29981,20.17096 8.48472,19.35416L7.00852,17.87487L24.23118,0.61615zM16.84984,6.04055L13.89745,8.99913L9.96023,5.05368L5.03889,9.98533L8.9761,13.93078L7.00852,17.87487L0.61132,11.46427C-0.20377,10.64747 -0.20377,9.32318 0.61132,8.50638L8.48472,0.61649C9.29981,-0.20031 10.62168,-0.20065 11.43678,0.61615L16.84984,6.04055z" id="svg_4"></path></g><path d="M69.9619,17.85659 L69.9619,16.278309999999998 L68.34275,16.278309999999998 L68.34275,17.85659 L69.9619,17.85659 zM74.80461,17.95985 C75.58965,17.95985 76.25448,17.76318 76.7991,17.36983 C77.34373,16.97649 77.72398,16.450400000000002 77.93987,15.791549999999999 L77.93987,17.85659 L79.27934,17.85659 L79.27934,6.9413599999999995 L77.93987,6.9413599999999995 L77.93987,11.82371 C77.72398,11.16487 77.34373,10.638770000000001 76.7991,10.24543 S75.58965,9.65542 74.80461,9.65542 C74.08826,9.65542 73.45042,9.82259 72.89108,10.156930000000001 S71.8926,10.97311 71.57368,11.60246 C71.25476,12.23181 71.0953,12.96932 71.0953,13.815010000000001 S71.25476,15.39575 71.57368,16.02018 C71.8926,16.64461 72.33174,17.12399 72.89108,17.45834 S74.08826,17.95985 74.80461,17.95985 zM75.18732,16.77982 C74.36303,16.77982 73.7031,16.51677 73.20755,15.99068 C72.71199,15.46458 72.46421,14.73936 72.46421,13.815010000000001 S72.71199,12.16543 73.20755,11.63933 C73.7031,11.11324 74.36303,10.85019 75.18732,10.85019 C75.71722,10.85019 76.1907,10.97065 76.60775,11.21157 C77.0248,11.4525 77.35109,11.79913 77.5866,12.25147 C77.82211,12.70382 77.93987,13.22499 77.93987,13.815010000000001 S77.82211,14.92374 77.5866,15.37117 C77.35109,15.81859 77.0248,16.165219999999998 76.60775,16.41106 C76.1907,16.6569 75.71722,16.77982 75.18732,16.77982 zM84.99051,17.95985 C85.66761,17.95985 86.27601,17.836930000000002 86.81573,17.59109 C87.35544,17.34525 87.79457,17.00108 88.13312,16.55857 S88.69001,15.61455 88.78814,15.05403 L87.36035,15.05403 C87.26222,15.60471 86.99481,16.04476 86.55814,16.37419 C86.12146,16.703609999999998 85.57929,16.86832 84.93163,16.86832 C84.21528,16.86832 83.60933,16.637230000000002 83.11377,16.175060000000002 S82.35572,15.01962 82.32628,14.09526 L88.78814,14.09526 C88.82739,13.88876 88.84702,13.64292 88.84702,13.35775 C88.84702,12.67923 88.69246,12.05972 88.38335,11.49921 C88.07424,10.93869 87.62775,10.49127 87.04388,10.156930000000001 C86.46001,9.82259 85.77555,9.65542 84.99051,9.65542 C84.21528,9.65542 83.52837,9.82259 82.92978,10.156930000000001 S81.86261,10.97311 81.52407,11.60246 C81.18552,12.23181 81.01624,12.96932 81.01624,13.815010000000001 S81.18552,15.39575 81.52407,16.02018 C81.86261,16.64461 82.33118,17.12399 82.92978,17.45834 S84.21528,17.95985 84.99051,17.95985 zM87.49282,13.44625 L82.32628,13.44625 C82.36553,12.56123 82.63539,11.89009 83.13585,11.43283 C83.63631,10.97557 84.25453,10.74694 84.99051,10.74694 C85.45172,10.74694 85.87859,10.84528 86.27111,11.04195 C86.66363,11.23862 86.97274,11.53854 87.19843,11.94172 C87.42413,12.34489 87.52226,12.8464 87.49282,13.44625 zM94.51403,17.85659 L97.67872,9.75867 L96.23621,9.75867 L93.73389,16.42581 L91.20214,9.75867 L89.75963,9.75867 L92.92432,17.85659 L94.51403,17.85659 z" fillRule="nonzero" opacity=".56" id="svg_6" strokeDasharray="none"></path><text fill={fill} stroke="null" strokeWidth="0" strokeOpacity="null" fillOpacity="null" x="39.5" y="18.453125" id="svg_7" fontSize="25" fontFamily="sans-serif" textAnchor="start" strokeDasharray="none">im</text></g>
+                </svg>
+            </Box>
+
+        </Link>
     )
 }
 
 export const LogoIcon = (props: HTMLChakraProps<"svg">) => {
     const fill = useColorModeValue("#151618", "#fff")
     return (
-        <>
-        <svg height="20" viewBox="0 0 114 20" width="114" xmlns="http://www.w3.org/2000/svg">
-            \<g fill={fill} fillRule="evenodd" id="svg_1">
-                <g fillRule="nonzero" id="svg_2">
-                    <path d="M30.6276,9.99306L26.69038,6.0476L28.65797,2.10352L35.05517,8.51411C35.87026,9.33091 35.87026,10.65521 35.05517,11.472L27.18143,19.36223C26.36633,20.17903 25.04481,20.17903 24.22971,19.36223C23.41462,18.54543 23.41462,17.22114 24.22971,16.40434L30.6276,9.99306z" opacity=".56" id="svg_3"></path>
-                    <path d="M24.23118,0.61615C25.04627,-0.20065 26.36814,-0.20031 27.18323,0.61649L28.65943,2.09578L11.43678,19.3545C10.62168,20.1713 9.29981,20.17096 8.48472,19.35416L7.00852,17.87487L24.23118,0.61615zM16.84984,6.04055L13.89745,8.99913L9.96023,5.05368L5.03889,9.98533L8.9761,13.93078L7.00852,17.87487L0.61132,11.46427C-0.20377,10.64747 -0.20377,9.32318 0.61132,8.50638L8.48472,0.61649C9.29981,-0.20031 10.62168,-0.20065 11.43678,0.61615L16.84984,6.04055z" id="svg_4"></path>
-                </g>
-                </g>
-        </svg>
-        </>
+        <Link href="/">
+            <Box cursor="pointer">
+                <svg height="20" viewBox="0 0 114 20" width="114" xmlns="http://www.w3.org/2000/svg">
+                    \<g fill={fill} fillRule="evenodd" id="svg_1">
+                        <g fillRule="nonzero" id="svg_2">
+                            <path d="M30.6276,9.99306L26.69038,6.0476L28.65797,2.10352L35.05517,8.51411C35.87026,9.33091 35.87026,10.65521 35.05517,11.472L27.18143,19.36223C26.36633,20.17903 25.04481,20.17903 24.22971,19.36223C23.41462,18.54543 23.41462,17.22114 24.22971,16.40434L30.6276,9.99306z" opacity=".56" id="svg_3"></path>
+                            <path d="M24.23118,0.61615C25.04627,-0.20065 26.36814,-0.20031 27.18323,0.61649L28.65943,2.09578L11.43678,19.3545C10.62168,20.1713 9.29981,20.17096 8.48472,19.35416L7.00852,17.87487L24.23118,0.61615zM16.84984,6.04055L13.89745,8.99913L9.96023,5.05368L5.03889,9.98533L8.9761,13.93078L7.00852,17.87487L0.61132,11.46427C-0.20377,10.64747 -0.20377,9.32318 0.61132,8.50638L8.48472,0.61649C9.29981,-0.20031 10.62168,-0.20065 11.43678,0.61615L16.84984,6.04055z" id="svg_4"></path>
+                        </g>
+                    </g>
+                </svg>
+            </Box>
+        </Link>
     )
 }
 
diff --git a/src/components/svg-icon.tsx b/src/components/svg-icon.tsx
index c8828c23..c9ad7976 100644
--- a/src/components/svg-icon.tsx
+++ b/src/components/svg-icon.tsx
@@ -28,6 +28,12 @@ export function getSvgIcon(name,height="1.4rem") {
         case "recent":
             svg = <svg fill="currentColor" height={height} viewBox="0 0 512 512"><path d="M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm216 248c0 118.7-96.1 216-216 216-118.7 0-216-96.1-216-216 0-118.7 96.1-216 216-216 118.7 0 216 96.1 216 216zm-148.9 88.3l-81.2-59c-3.1-2.3-4.9-5.9-4.9-9.7V116c0-6.6 5.4-12 12-12h14c6.6 0 12 5.4 12 12v146.3l70.5 51.3c5.4 3.9 6.5 11.4 2.6 16.8l-8.2 11.3c-3.9 5.3-11.4 6.5-16.8 2.6z"></path></svg>
             break
+        case "search":
+            svg = <svg viewBox="0 0 200 200"  fill="currentColor" height={height}  ><g clip-path="url(#clip0)"><path d="M186.804 176.609l-44.092-44.091a4.054 4.054 0 00-2.905-1.197h-3.521c11.724-12.68 18.902-29.599 18.902-48.227C155.188 43.82 123.366 12 84.094 12 44.82 12 13 43.821 13 83.094c0 39.272 31.821 71.094 71.094 71.094 18.628 0 35.547-7.178 48.227-18.868v3.487c0 1.093.445 2.119 1.197 2.905l44.091 44.092a4.107 4.107 0 005.811 0l3.384-3.384a4.107 4.107 0 000-5.811zM84.094 143.25c-33.257 0-60.156-26.899-60.156-60.156s26.899-60.156 60.156-60.156 60.156 26.899 60.156 60.156-26.899 60.156-60.156 60.156z"></path></g><defs><clipPath><path transform="translate(13 12)" d="M0 0h175v175H0z"></path></clipPath></defs></svg>
+            break
+        case "user":
+            svg = <svg fill="currentColor" height={height}  viewBox="0 0 24 24"><path fill="none" d="M0 0h24v24H0V0z"></path><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zM7.07 18.28c.43-.9 3.05-1.78 4.93-1.78s4.51.88 4.93 1.78C15.57 19.36 13.86 20 12 20s-3.57-.64-4.93-1.72zm11.29-1.45c-1.43-1.74-4.9-2.33-6.36-2.33s-4.93.59-6.36 2.33C4.62 15.49 4 13.82 4 12c0-4.41 3.59-8 8-8s8 3.59 8 8c0 1.82-.62 3.49-1.64 4.83zM12 6c-1.94 0-3.5 1.56-3.5 3.5S10.06 13 12 13s3.5-1.56 3.5-3.5S13.94 6 12 6zm0 5c-.83 0-1.5-.67-1.5-1.5S11.17 8 12 8s1.5.67 1.5 1.5S12.83 11 12 11z"></path></svg>
+            break
         default:
             break; 
     }
diff --git a/src/data/links.tsx b/src/data/links.tsx
index 6ea90532..52946c9c 100644
--- a/src/data/links.tsx
+++ b/src/data/links.tsx
@@ -1,6 +1,6 @@
-import {getSvgIcon } from 'components/svg-icon'
+import { getSvgIcon } from 'components/svg-icon'
 import React from 'react'
-import { FaFileAlt, FaScroll, FaBookOpen, FaTags, FaUserCircle, FaRegFile } from 'react-icons/fa'
+import { FaFileAlt, FaScroll, FaBookOpen, FaTags, FaUserCircle, FaRegFile, FaUser, FaRegUser } from 'react-icons/fa'
 import { Route } from 'src/types/route'
 import { ReserveUrls } from './reserve-urls'
 export const editorLinks: Route[] = [{
@@ -17,6 +17,26 @@ export const editorLinks: Route[] = [{
 }
 ]
 
+export const searchLinks: Route[] = [{
+    title: '文章',
+    path: `${ReserveUrls.Search}/posts`,
+    icon: getSvgIcon("post"),
+    disabled: false
+},
+{
+    title: '标签',
+    path: `${ReserveUrls.Search}/tags`,
+    icon: getSvgIcon("tags","1.2rem"),
+    disabled: false
+},
+{
+    title: '用户',
+    path: `${ReserveUrls.Search}/users`,
+    icon: getSvgIcon('user','1.5rem'),
+    disabled: false
+}
+]
+
 export const adminLinks: Route[] = [{
     title: '标签管理',
     path: `${ReserveUrls.Admin}/tags`,
@@ -30,4 +50,25 @@ export const settingLinks: Route[] = [{
     path: `${ReserveUrls.Settings}/profile`,
     icon: <FaUserCircle />,
     disabled: false
-}]
\ No newline at end of file
+}]
+
+
+export const navLinks = [{
+    title: '主页',
+    url: '/',
+    baseUrl: '/',
+    icon: getSvgIcon("home", "1.4rem")
+},
+{
+    title: '标签',
+    url: ReserveUrls.Tags,
+    baseUrl: ReserveUrls.Tags,
+    icon: getSvgIcon("tags", "1.2rem")
+},
+{
+    title: 'Search',
+    url: `${ReserveUrls.Search}/posts`,
+    baseUrl: `${ReserveUrls.Search}`,
+    icon: getSvgIcon("search", "1.2rem")
+},
+]
\ No newline at end of file
diff --git a/src/data/reserve-urls.ts b/src/data/reserve-urls.ts
index d39da0db..cfd63ab7 100644
--- a/src/data/reserve-urls.ts
+++ b/src/data/reserve-urls.ts
@@ -12,4 +12,5 @@ export enum ReserveUrls {
     Sponsors = "/sponsors",
     Explore = "/explore",
     Login = "/login",
+    Search= "/search",
 }
\ No newline at end of file
diff --git a/theme.ts b/theme.ts
index 8396dff2..2d368e0d 100644
--- a/theme.ts
+++ b/theme.ts
@@ -163,6 +163,21 @@ const customTheme = extendTheme({
       lineHeight: "normal",
     },
   },
+  components : {
+    Heading: {
+      sizes: {
+        lg: {
+          fontSize: '1.8rem',
+        },
+        md: {
+          fontSize: '1.5rem'
+        },
+        sm: {
+          fontSize: '1.1rem'
+        }
+      }
+    }
+  }
 })
 
 export default customTheme