diff --git a/openmetadata-ui/src/main/resources/ui/src/assets/svg/search.svg b/openmetadata-ui/src/main/resources/ui/src/assets/svg/search.svg
new file mode 100644
index 00000000000..2a697ffe36a
--- /dev/null
+++ b/openmetadata-ui/src/main/resources/ui/src/assets/svg/search.svg
@@ -0,0 +1,3 @@
+<svg width="14" height="15" viewBox="0 0 14 15" fill="#37352F" xmlns="http://www.w3.org/2000/svg">
+<path d="M13.8086 12.1051L11.0824 9.37891C10.9594 9.25586 10.7926 9.1875 10.6176 9.1875H10.1719C10.9266 8.22227 11.375 7.0082 11.375 5.6875C11.375 2.5457 8.8293 0 5.6875 0C2.5457 0 0 2.5457 0 5.6875C0 8.8293 2.5457 11.375 5.6875 11.375C7.0082 11.375 8.22227 10.9266 9.1875 10.1719V10.6176C9.1875 10.7926 9.25586 10.9594 9.37891 11.0824L12.1051 13.8086C12.3621 14.0656 12.7777 14.0656 13.032 13.8086L13.8059 13.0348C14.0629 12.7777 14.0629 12.3621 13.8086 12.1051ZM5.6875 9.1875C3.7543 9.1875 2.1875 7.62344 2.1875 5.6875C2.1875 3.7543 3.75156 2.1875 5.6875 2.1875C7.6207 2.1875 9.1875 3.75156 9.1875 5.6875C9.1875 7.6207 7.62344 9.1875 5.6875 9.1875Z" fill="#37352F"/>
+</svg>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/app-bar/Appbar.tsx b/openmetadata-ui/src/main/resources/ui/src/components/app-bar/Appbar.tsx
index 7c2c35debd4..b388bf96876 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/app-bar/Appbar.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/app-bar/Appbar.tsx
@@ -131,7 +131,8 @@ const Appbar: React.FC = (): JSX.Element => {
 
     return (
       <span data-testid="greeting-text">
-        Welcome, <span className="tw-font-medium">{name?.split(' ')[0]}</span>
+        <span className="tw-font-medium">{name}</span>
+        <hr className="tw--mr-2 tw--ml-2 tw-mt-1.5" />
       </span>
     );
   };
@@ -165,7 +166,7 @@ const Appbar: React.FC = (): JSX.Element => {
       {isAuthenticatedRoute && isSignedIn ? (
         <div className="tw-h-14 tw-py-2 tw-px-5 tw-border-b-2 tw-border-separator">
           <div className="tw-flex tw-items-center tw-flex-row tw-justify-between tw-flex-nowrap">
-            <div className="tw-flex tw-items-center tw-flex-row tw-justify-between tw-flex-nowrap tw-mr-auto">
+            <div className="tw-flex tw-items-center tw-flex-row tw-justify-between tw-flex-nowrap">
               <NavLink id="openmetadata_logo" to="/">
                 <SVGIcons
                   alt="OpenMetadata Logo"
@@ -173,57 +174,7 @@ const Appbar: React.FC = (): JSX.Element => {
                   width="30"
                 />
               </NavLink>
-              <div
-                className="tw-flex-none tw-relative tw-pl-5 "
-                data-testid="appbar-item">
-                <span className="fa fa-search tw-absolute tw-block tw-z-10 tw-w-9 tw-h-8 tw-leading-8 tw-text-center tw-pointer-events-none tw-text-gray-400" />
-                <input
-                  autoComplete="off"
-                  className="tw-relative search-grey tw-rounded tw-border tw-border-main tw-bg-body-main focus:tw-outline-none tw-pl-8 tw-py-1 tw-form-inputs"
-                  data-testid="searchBox"
-                  id="searchBox"
-                  type="text"
-                  value={searchValue || ''}
-                  onChange={(e) => {
-                    setSearchValue(e.target.value);
-                  }}
-                  onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {
-                    const target = e.target as HTMLInputElement;
-                    if (e.key === 'Enter') {
-                      setIsOpen(false);
-                      addToRecentSearch(target.value);
-                      history.push(
-                        getExplorePathWithSearch(
-                          target.value,
-                          // this is for if user is searching from another page
-                          location.pathname.startsWith(ROUTES.EXPLORE)
-                            ? appState.explorePageTab
-                            : 'tables'
-                        )
-                      );
-                    }
-                  }}
-                />
-                {searchValue &&
-                  (isInPageSearchAllowed(location.pathname) ? (
-                    <SearchOptions
-                      isOpen={isOpen}
-                      options={inPageSearchOptions(location.pathname)}
-                      searchText={searchValue}
-                      selectOption={(text) => {
-                        appState.inPageSearchText = text;
-                      }}
-                      setIsOpen={setIsOpen}
-                    />
-                  ) : (
-                    <Suggestions
-                      isOpen={isOpen}
-                      searchText={searchValue}
-                      setIsOpen={setIsOpen}
-                    />
-                  ))}
-              </div>
-              <div className="tw-ml-9">
+              <div className="tw-ml-7">
                 <NavLink
                   className="tw-nav focus:tw-no-underline"
                   data-testid="appbar-item"
@@ -241,19 +192,75 @@ const Appbar: React.FC = (): JSX.Element => {
                 />
               </div>
             </div>
-            <button
-              className="tw-nav focus:tw-no-underline hover:tw-underline"
-              data-testid="whatsnew-modal"
-              onClick={openModal}>
+            <div
+              className="tw-flex-none tw-relative tw-justify-items-center tw-ml-auto"
+              data-testid="appbar-item">
               <SVGIcons
-                alt="Doc icon"
-                className="tw-align-middle tw--mt-0.5 tw-mr-1"
-                icon={Icons.WHATS_NEW}
-                width="16"
+                alt="icon-search"
+                className="tw-absolute tw-block tw-z-10 tw-w-4 tw-h-4 tw-right-2.5 tw-top-2 tw-leading-8 tw-text-center tw-pointer-events-none"
+                icon="icon-searchv1"
               />
-              <span>What&#39;s new</span>
-            </button>
-            {/* <NavLink
+              <input
+                autoComplete="off"
+                className="tw-relative search-grey tw-rounded tw-border tw-border-main focus:tw-outline-none tw-pl-2 tw-py-1 tw-form-inputs"
+                data-testid="searchBox"
+                id="searchBox"
+                placeholder="Search for Table, Topics, Dashboards and Pipeline"
+                type="text"
+                value={searchValue || ''}
+                onChange={(e) => {
+                  setSearchValue(e.target.value);
+                }}
+                onKeyDown={(e: React.KeyboardEvent<HTMLInputElement>) => {
+                  const target = e.target as HTMLInputElement;
+                  if (e.key === 'Enter') {
+                    setIsOpen(false);
+                    addToRecentSearch(target.value);
+                    history.push(
+                      getExplorePathWithSearch(
+                        target.value,
+                        // this is for if user is searching from another page
+                        location.pathname.startsWith(ROUTES.EXPLORE)
+                          ? appState.explorePageTab
+                          : 'tables'
+                      )
+                    );
+                  }
+                }}
+              />
+              {searchValue &&
+                (isInPageSearchAllowed(location.pathname) ? (
+                  <SearchOptions
+                    isOpen={isOpen}
+                    options={inPageSearchOptions(location.pathname)}
+                    searchText={searchValue}
+                    selectOption={(text) => {
+                      appState.inPageSearchText = text;
+                    }}
+                    setIsOpen={setIsOpen}
+                  />
+                ) : (
+                  <Suggestions
+                    isOpen={isOpen}
+                    searchText={searchValue}
+                    setIsOpen={setIsOpen}
+                  />
+                ))}
+            </div>
+            <div className="tw-flex tw-ml-auto">
+              <button
+                className="tw-nav focus:tw-no-underline hover:tw-underline"
+                data-testid="whatsnew-modal"
+                onClick={openModal}>
+                <SVGIcons
+                  alt="Doc icon"
+                  className="tw-align-middle tw--mt-0.5 tw-mr-1"
+                  icon={Icons.WHATS_NEW}
+                  width="16"
+                />
+                {/* <span>What&#39;s new</span> */}
+              </button>
+              {/* <NavLink
               className="tw-nav focus:tw-no-underline hover:tw-underline"
               data-testid="tour"
               style={navStyle(location.pathname.startsWith('/explore'))}
@@ -268,35 +275,49 @@ const Appbar: React.FC = (): JSX.Element => {
               />
               <span>Tour</span>
             </NavLink> */}
-            <div>
-              <DropDown
-                dropDownList={supportLinks}
-                icon={
-                  <SVGIcons
-                    alt="Doc icon"
-                    className="tw-align-middle tw-mt-0.5 tw-mr-1"
-                    icon={Icons.HELP_CIRCLE}
-                    width="16"
-                  />
-                }
-                label="Need Help"
-                type="link"
-              />
+              <div>
+                <DropDown
+                  dropDownList={supportLinks}
+                  icon={
+                    <SVGIcons
+                      alt="Doc icon"
+                      className="tw-align-middle tw-mt-0.5 tw-mr-1"
+                      icon={Icons.HELP_CIRCLE}
+                      width="16"
+                    />
+                  }
+                  isDropDownIconVisible={false}
+                  // label="Need Help"
+                  type="link"
+                />
+              </div>
             </div>
             <div data-testid="dropdown-profile">
               <DropDown
                 dropDownList={[
+                  {
+                    name: (
+                      <p className="tw-flex tw-flex-col">
+                        <span>Signed in as</span>
+                        {getUserDisplayName()}
+                      </p>
+                    ),
+                    to: '',
+                    disabled: false,
+                    icon: <></>,
+                    isText: true,
+                  },
                   {
                     name: (
                       <span className="tw-text-grey-muted tw-cursor-text tw-text-xs">
                         {`Version ${(version ? version : '?').split('-')[0]}`}
-                        <hr className="tw--mr-12 tw--ml-2 tw-mt-1.5" />
+                        <hr className="tw--mr-2 tw--ml-2 tw-mt-2" />
                       </span>
                     ),
                     to: '',
                     disabled: false,
                     icon: <></>,
-                    isVersion: true,
+                    isText: true,
                   },
                   {
                     name: 'Logout',
@@ -326,7 +347,6 @@ const Appbar: React.FC = (): JSX.Element => {
                     )}
                   </>
                 }
-                label={getUserDisplayName()}
                 type="link"
               />
             </div>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/app-bar/Suggestions.tsx b/openmetadata-ui/src/main/resources/ui/src/components/app-bar/Suggestions.tsx
index 2d07986b6a2..97ebe5f808b 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/app-bar/Suggestions.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/app-bar/Suggestions.tsx
@@ -302,7 +302,7 @@ const Suggestions = ({ searchText, isOpen, setIsOpen }: SuggestionProp) => {
             aria-labelledby="menu-button"
             aria-orientation="vertical"
             className="tw-origin-top-right tw-absolute tw-z-10
-          tw-w-60 tw-mt-1 tw-rounded-md tw-shadow-lg
+          tw-w-full tw-mt-1 tw-rounded-md tw-shadow-lg
         tw-bg-white tw-ring-1 tw-ring-black tw-ring-opacity-5 focus:tw-outline-none"
             role="menu">
             {getEntitiesSuggestions()}
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/dropdown/AnchorDropDownList.tsx b/openmetadata-ui/src/main/resources/ui/src/components/dropdown/AnchorDropDownList.tsx
index e41200b0a7d..6362196cfc5 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/dropdown/AnchorDropDownList.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/dropdown/AnchorDropDownList.tsx
@@ -34,8 +34,8 @@ const AnchorDropDownList = ({ dropDownList, setIsOpen }: DropDownListProp) => {
         <div className="py-1" role="none">
           {dropDownList.map((item: DropDownListItem, index: number) => (
             <div key={index}>
-              {item.isVersion ? (
-                <div className="tw-px-2 tw-py-2 tw-font-normal">
+              {item.isText ? (
+                <div className="tw-px-2 tw-py-1 tw-font-normal">
                   {item.name}
                 </div>
               ) : (
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/dropdown/DropDown.tsx b/openmetadata-ui/src/main/resources/ui/src/components/dropdown/DropDown.tsx
index 4102213a929..b2e17efe4d3 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/dropdown/DropDown.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/components/dropdown/DropDown.tsx
@@ -26,6 +26,7 @@ const DropDown: React.FC<DropDownProp> = ({
   dropDownList,
   onSelect,
   selectedItems,
+  isDropDownIconVisible = true,
 }: DropDownProp) => {
   const [isOpen, setIsOpen] = useState<boolean>(false);
 
@@ -63,7 +64,7 @@ const DropDown: React.FC<DropDownProp> = ({
           <button
             aria-expanded="true"
             aria-haspopup="true"
-            className={`tw-inline-flex tw-px-4 tw-py-2 focus:tw-outline-none ${
+            className={`tw-inline-flex tw-px-2 tw-py-2 focus:tw-outline-none ${
               type === DropDownType.CHECKBOX
                 ? `tw-rounded tw-text-body tw-text-gray-400 tw-border tw-border-main focus:tw-border-gray-500 tw-w-full`
                 : `tw-justify-center tw-nav`
@@ -107,7 +108,11 @@ const DropDown: React.FC<DropDownProp> = ({
                   </p>
                 )}
 
-                <DropdownIcon style={{ marginTop: '1px', color: normalLink }} />
+                {isDropDownIconVisible ? (
+                  <DropdownIcon
+                    style={{ marginTop: '1px', color: normalLink }}
+                  />
+                ) : null}
               </>
             )}
           </button>
diff --git a/openmetadata-ui/src/main/resources/ui/src/components/dropdown/types.ts b/openmetadata-ui/src/main/resources/ui/src/components/dropdown/types.ts
index c44d5bc3892..334edcfdc93 100644
--- a/openmetadata-ui/src/main/resources/ui/src/components/dropdown/types.ts
+++ b/openmetadata-ui/src/main/resources/ui/src/components/dropdown/types.ts
@@ -28,7 +28,7 @@ export type DropDownListItem = {
   method?: () => void;
   icon?: React.ReactElement;
   isOpenNewTab?: boolean;
-  isVersion?: boolean;
+  isText?: boolean;
 } & Record<
   string,
   string | number | boolean | undefined | Function | React.ReactElement
@@ -58,4 +58,5 @@ export type DropDownProp = {
   label?: string | React.ReactElement;
   type: string;
   icon?: React.ReactElement | string;
+  isDropDownIconVisible?: boolean;
 } & DropDownListProp;
diff --git a/openmetadata-ui/src/main/resources/ui/src/styles/x-master.css b/openmetadata-ui/src/main/resources/ui/src/styles/x-master.css
index b9512200e62..2dfd356b644 100644
--- a/openmetadata-ui/src/main/resources/ui/src/styles/x-master.css
+++ b/openmetadata-ui/src/main/resources/ui/src/styles/x-master.css
@@ -164,8 +164,7 @@ a:focus {
   box-shadow: none;
 }
 .search-grey {
-  width: calc(300px - 60px);
-  min-width: 150px;
+  width: 600px;
 }
 
 .search-grey.has-search {
@@ -755,27 +754,19 @@ body .profiler-graph .recharts-active-dot circle {
 }
 
 /* Hide scrollbar for Chrome, Safari and Opera */
-/* #center::-webkit-scrollbar,
+#center::-webkit-scrollbar,
 #left-panel::-webkit-scrollbar,
 #right-panel::-webkit-scrollbar {
   display: none;
-  width: 4px;
-} */
-/* #center::-webkit-scrollbar-track {
-  background: #f8f9fa;
 }
-#center::-webkit-scrollbar-thumb {
-  background: #aaa;
-  border-radius: 12px;
-} */
 
 /* Hide scrollbar for IE, Edge and Firefox */
-/* #center,
+#center,
 #left-panel,
 #right-panel {
   -ms-overflow-style: none;
-  scrollbar-width: 4px;
-} */
+  scrollbar-width: none;
+}
 
 .page-layout-container {
   display: grid;
diff --git a/openmetadata-ui/src/main/resources/ui/src/utils/SvgUtils.tsx b/openmetadata-ui/src/main/resources/ui/src/utils/SvgUtils.tsx
index 3948cfa75b6..2218865253c 100644
--- a/openmetadata-ui/src/main/resources/ui/src/utils/SvgUtils.tsx
+++ b/openmetadata-ui/src/main/resources/ui/src/utils/SvgUtils.tsx
@@ -75,6 +75,7 @@ import IconPipeline from '../assets/svg/pipeline.svg';
 import IconPlus from '../assets/svg/plus.svg';
 import IconProfiler from '../assets/svg/profiler.svg';
 import IconHelpCircle from '../assets/svg/question-circle.svg';
+import IconSearchV1 from '../assets/svg/search.svg';
 import IconSetting from '../assets/svg/service.svg';
 import IconSlackGrey from '../assets/svg/slack-grey.svg';
 import IconSlack from '../assets/svg/slack.svg';
@@ -175,6 +176,7 @@ export const Icons = {
   ICON_MINUS: 'icon-minus',
   TAG: 'icon-tag',
   TIER: 'icon-tier',
+  SEARCHV1: 'icon-searchv1',
 };
 
 const SVGIcons: FunctionComponent<Props> = ({
@@ -496,6 +498,10 @@ const SVGIcons: FunctionComponent<Props> = ({
     case Icons.TIER:
       IconComponent = IconTier;
 
+      break;
+    case Icons.SEARCHV1:
+      IconComponent = IconSearchV1;
+
       break;
 
     default: