diff --git a/packages/web/components/elements/KBar.tsx b/packages/web/components/elements/KBar.tsx
index 81d9c4510..f26b5fb1a 100644
--- a/packages/web/components/elements/KBar.tsx
+++ b/packages/web/components/elements/KBar.tsx
@@ -14,13 +14,14 @@ export const searchStyle = {
 }
 
 export const animatorStyle = {
-  maxWidth: '600px',
   width: '100%',
-  backgroundColor: theme.colors.grayBase.toString(),
-  color: theme.colors.grayTextContrast.toString(),
-  borderRadius: '8px',
   overflow: 'hidden',
-  boxShadow: '0px 6px 20px rgba(0, 0, 0, 0.2)',
+  maxWidth: '600px',
+  borderRadius: '8px',
+  color: theme.colors.grayTextContrast.toString(),
+  backgroundColor: theme.colors.grayBase.toString(),
+  boxShadow: theme.shadows.cardBoxShadow.toString(),
+  border: `1px solid ${theme.colors.grayBorder.toString()}`,
 }
 
 const groupNameStyle = {
diff --git a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx
index 92d5ad30c..ec73a6477 100644
--- a/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx
+++ b/packages/web/components/templates/homeFeed/HomeFeedContainer.tsx
@@ -47,6 +47,7 @@ import { EditTitleModal } from './EditTitleModal'
 import { useGetUserPreferences } from '../../../lib/networking/queries/useGetUserPreferences'
 import { searchQuery } from '../../../lib/networking/queries/search'
 import debounce from 'lodash/debounce'
+import { SearchItem, TypeaheadSearchItemsData, typeaheadSearchQuery } from '../../../lib/networking/queries/typeaheadSearch'
 
 export type LayoutType = 'LIST_LAYOUT' | 'GRID_LAYOUT'
 
@@ -66,7 +67,7 @@ const SAVED_SEARCHES: Record<string, string> = {
 
 const fetchSearchResults = async (query: string, cb: any) => {
   if (!query.startsWith('#')) return
-  const res = await searchQuery({ limit: 10, searchQuery: query.substring(1)})
+  const res = await typeaheadSearchQuery({ limit: 10, searchQuery: query.substring(1)})
   cb(res);
 };
 
@@ -80,7 +81,7 @@ export function HomeFeedContainer(): JSX.Element {
   const { viewerData } = useGetViewerQuery()
   const router = useRouter()
   const { queryValue } = useKBar((state) => ({queryValue: state.searchQuery}));
-  const [searchResults, setSearchResults] = useState<LibraryItem[]>([]);
+  const [searchResults, setSearchResults] = useState<SearchItem[]>([]);
 
   const defaultQuery = {
     limit: 10,
@@ -121,8 +122,8 @@ export function HomeFeedContainer(): JSX.Element {
 
   useEffect(() => {
     if (queryValue.startsWith('#')) {
-      debouncedFetchSearchResults(queryValue, (data: LibraryItemsData) => {
-        setSearchResults(data?.search.edges || [])
+      debouncedFetchSearchResults(queryValue, (data: TypeaheadSearchItemsData) => {
+        setSearchResults(data?.typeaheadSearch.items || [])
       })
     }
     else setSearchResults([])
@@ -506,11 +507,17 @@ export function HomeFeedContainer(): JSX.Element {
   ]
 
   useRegisterActions(searchResults.map(link => ({
-    id: link.node.id,
+    id: link.id,
     section: 'Search Results',
-    name: link.node.title,
-    keywords: '#' + link.node.title,
-    perform: () => handleCardAction('showDetail', link),
+    name: link.title,
+    keywords: '#' + link.title,
+    perform: () => {
+      const username = viewerData?.me?.profile.username
+      if (username) {
+        setActiveCardId(link.id)
+        router.push(`/${username}/${link.slug}`)
+      }
+    },
   })), [searchResults])
 
   useRegisterActions(activeCardId ? [...ACTIVE_ACTIONS, ...UNACTIVE_ACTIONS] : UNACTIVE_ACTIONS, [activeCardId, activeItem]);
diff --git a/yarn.lock b/yarn.lock
index 45ca87bfb..9412790f6 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -7678,6 +7678,13 @@
   dependencies:
     "@types/node" "*"
 
+"@types/graphql-fields@^1.3.4":
+  version "1.3.4"
+  resolved "https://registry.yarnpkg.com/@types/graphql-fields/-/graphql-fields-1.3.4.tgz#868ffe444ba8027ea1eccb0909f9c331d1bd620a"
+  integrity sha512-McLJaAaqY7lk9d9y7E61iQrj0AwcEjSb8uHlPh7KgYV+XX1MSLlSt/alhd5k2BPRE8gy/f4lnkLGb5ke3iG66Q==
+  dependencies:
+    graphql "^15.3.0"
+
 "@types/hast@^2.0.0":
   version "2.3.4"
   resolved "https://registry.yarnpkg.com/@types/hast/-/hast-2.3.4.tgz#8aa5ef92c117d20d974a82bdfb6a648b08c0bafc"
@@ -14649,6 +14656,11 @@ graphql-config@^4.1.0:
     minimatch "3.0.4"
     string-env-interpolation "1.0.1"
 
+graphql-fields@^2.0.3:
+  version "2.0.3"
+  resolved "https://registry.yarnpkg.com/graphql-fields/-/graphql-fields-2.0.3.tgz#5e68dff7afbb202be4f4f40623e983b22c96ab8f"
+  integrity sha512-x3VE5lUcR4XCOxPIqaO4CE+bTK8u6gVouOdpQX9+EKHr+scqtK5Pp/l8nIGqIpN1TUlkKE6jDCCycm/WtLRAwA==
+
 graphql-middleware@^6.0.10:
   version "6.1.4"
   resolved "https://registry.yarnpkg.com/graphql-middleware/-/graphql-middleware-6.1.4.tgz#1b4dd66195477046282acc8937cb5fca32b6bfd5"