diff --git a/apps/cowswap-frontend/src/modules/tokensList/containers/TokenSearchResults/index.tsx b/apps/cowswap-frontend/src/modules/tokensList/containers/TokenSearchResults/index.tsx
index 4ca54eced2..4bb84a16f8 100644
--- a/apps/cowswap-frontend/src/modules/tokensList/containers/TokenSearchResults/index.tsx
+++ b/apps/cowswap-frontend/src/modules/tokensList/containers/TokenSearchResults/index.tsx
@@ -3,15 +3,6 @@ import { ReactNode, useCallback, useEffect, useMemo } from 'react'
 import { TokenWithLogo } from '@cowprotocol/common-const'
 import { doesTokenMatchSymbolOrAddress } from '@cowprotocol/common-utils'
 import { getTokenSearchFilter, TokenSearchResponse, useSearchToken } from '@cowprotocol/tokens'
-import {
-  BannerOrientation,
-  ExternalLink,
-  InlineBanner,
-  LINK_GUIDE_ADD_CUSTOM_TOKEN,
-  StatusColorVariant,
-} from '@cowprotocol/ui'
-
-import { Trans } from '@lingui/react/macro'
 
 import { useAddTokenImportCallback } from '../../hooks/useAddTokenImportCallback'
 import { useUpdateSelectTokenWidgetState } from '../../hooks/useUpdateSelectTokenWidgetState'
@@ -77,18 +68,6 @@ export function TokenSearchResults({
 
   return (
     <CommonListContainer id="currency-list">
-      <InlineBanner
-        margin={'10px'}
-        width="auto"
-        orientation={BannerOrientation.Horizontal}
-        bannerType={StatusColorVariant.Info}
-      >
-        <p>
-          <Trans>Can't find your token on the list?</Trans>{' '}
-          <Trans><ExternalLink href={LINK_GUIDE_ADD_CUSTOM_TOKEN}>Read our guide</ExternalLink> on how to add custom tokens.</Trans>
-        </p>
-      </InlineBanner>
-
       <TokenSearchContent
         importToken={addTokenImportCallback}
         searchInput={searchInput}
diff --git a/apps/cowswap-frontend/src/modules/tokensList/containers/TokenSearchResults/styled.ts b/apps/cowswap-frontend/src/modules/tokensList/containers/TokenSearchResults/styled.ts
index abea186dbe..2d0d5e94ed 100644
--- a/apps/cowswap-frontend/src/modules/tokensList/containers/TokenSearchResults/styled.ts
+++ b/apps/cowswap-frontend/src/modules/tokensList/containers/TokenSearchResults/styled.ts
@@ -9,11 +9,11 @@ export const TokenNotFound = styled.div`
   text-align: center;
 `
 
-export const ImportTokenWrapper = styled.div`
-  margin: 20px 0;
-`
-
 export const LoaderWrapper = styled.div`
   text-align: center;
   margin: 20px 0 10px 0;
 `
+
+export const SectionTitleRow = styled.div`
+  margin: 20px 0 8px;
+`
diff --git a/apps/cowswap-frontend/src/modules/tokensList/pure/ImportTokenItem/index.tsx b/apps/cowswap-frontend/src/modules/tokensList/pure/ImportTokenItem/index.tsx
index bad00ff4e3..aebb2411a7 100644
--- a/apps/cowswap-frontend/src/modules/tokensList/pure/ImportTokenItem/index.tsx
+++ b/apps/cowswap-frontend/src/modules/tokensList/pure/ImportTokenItem/index.tsx
@@ -1,3 +1,5 @@
+import { ReactNode } from 'react'
+
 import { TokenWithLogo } from '@cowprotocol/common-const'
 
 import { Trans } from '@lingui/react/macro'
@@ -13,14 +15,15 @@ export interface ImportTokenItemProps {
   importToken?(token: TokenWithLogo): void
   existing?: true
   shadowed?: boolean
+  wrapperId?: string
+  isFirstInSection?: boolean
+  isLastInSection?: boolean
 }
 
-// TODO: Add proper return type annotation
-// eslint-disable-next-line @typescript-eslint/explicit-function-return-type
-export function ImportTokenItem(props: ImportTokenItemProps) {
-  const { token, importToken, shadowed, existing } = props
+export function ImportTokenItem(props: ImportTokenItemProps): ReactNode {
+  const { token, importToken, shadowed, existing, wrapperId, isFirstInSection, isLastInSection } = props
   return (
-    <styledEl.Wrapper>
+    <styledEl.Wrapper id={wrapperId} $isFirst={isFirstInSection} $isLast={isLastInSection}>
       <div style={{ opacity: shadowed ? 0.6 : 1 }}>
         <TokenInfo token={token} />
       </div>
diff --git a/apps/cowswap-frontend/src/modules/tokensList/pure/ImportTokenItem/styled.ts b/apps/cowswap-frontend/src/modules/tokensList/pure/ImportTokenItem/styled.ts
index 068ff64547..d528acc946 100644
--- a/apps/cowswap-frontend/src/modules/tokensList/pure/ImportTokenItem/styled.ts
+++ b/apps/cowswap-frontend/src/modules/tokensList/pure/ImportTokenItem/styled.ts
@@ -2,20 +2,15 @@ import { Media, UI } from '@cowprotocol/ui'
 
 import styled from 'styled-components/macro'
 
-export const Wrapper = styled.div`
+export const Wrapper = styled.div<{ $isFirst?: boolean; $isLast?: boolean }>`
   display: flex;
   flex-direction: row;
   justify-content: space-between;
   align-items: center;
-  padding: 0 20px;
-  margin-bottom: 20px;
+  padding: ${({ $isFirst, $isLast }) => `${$isFirst ? '20px' : '0'} 20px ${$isLast ? '0' : '20px'} 20px`};
 
   ${Media.upToSmall()} {
-    padding: 0 14px;
-  }
-
-  &:last-child {
-    margin-bottom: 0;
+    padding: ${({ $isFirst, $isLast }) => `${$isFirst ? '20px' : '0'} 14px ${$isLast ? '0' : '20px'} 14px`};
   }
 `
 
diff --git a/apps/cowswap-frontend/src/modules/tokensList/pure/TokenSearchContent/index.tsx b/apps/cowswap-frontend/src/modules/tokensList/pure/TokenSearchContent/index.tsx
index 5330d9c277..a238ab18d0 100644
--- a/apps/cowswap-frontend/src/modules/tokensList/pure/TokenSearchContent/index.tsx
+++ b/apps/cowswap-frontend/src/modules/tokensList/pure/TokenSearchContent/index.tsx
@@ -1,12 +1,22 @@
-import { ReactNode, useMemo } from 'react'
+import { ReactNode, useCallback, useMemo } from 'react'
 
 import { TokenWithLogo } from '@cowprotocol/common-const'
 import { doesTokenMatchSymbolOrAddress } from '@cowprotocol/common-utils'
 import { TokenSearchResponse } from '@cowprotocol/tokens'
-import { Loader } from '@cowprotocol/ui'
+import {
+  BannerOrientation,
+  ExternalLink,
+  InlineBanner,
+  LINK_GUIDE_ADD_CUSTOM_TOKEN,
+  Loader,
+  StatusColorVariant,
+} from '@cowprotocol/ui'
 
 import { t } from '@lingui/core/macro'
 import { Trans } from '@lingui/react/macro'
+import { VirtualItem } from '@tanstack/react-virtual'
+
+import { VirtualList } from 'common/pure/VirtualList'
 
 import * as styledEl from '../../containers/TokenSearchResults/styled'
 import { SelectTokenContext } from '../../types'
@@ -23,7 +33,6 @@ interface TokenSearchContentProps {
   importToken: (tokenToImport: TokenWithLogo) => void
 }
 
-// TODO: Add proper return type annotation
 export function TokenSearchContent({
   searchInput,
   searchResults,
@@ -47,8 +56,6 @@ export function TokenSearchContent({
 
     for (const t of activeListsResult) {
       if (doesTokenMatchSymbolOrAddress(t, searchInput)) {
-        // There should ever be only 1 token with a given address
-        // There can be multiple with the same symbol
         matched.push(t)
       } else {
         remaining.push(t)
@@ -58,59 +65,211 @@ export function TokenSearchContent({
     return [matched, remaining]
   }, [activeListsResult, searchInput])
 
-  return isLoading ? (
-    <styledEl.LoaderWrapper>
-      <Loader />
-    </styledEl.LoaderWrapper>
-  ) : isTokenNotFound ? (
-    <styledEl.TokenNotFound>
-      <Trans>No tokens found</Trans>
-    </styledEl.TokenNotFound>
-  ) : (
-    <>
-      {/*Matched tokens first, followed by tokens from active lists*/}
-      {matchedTokens.concat(activeList).map((token) => {
-        return <TokenListItemContainer key={token.address} token={token} context={selectTokenContext} />
-      })}
-
-      {/*Tokens from blockchain*/}
-      {blockchainResult?.length ? (
-        <styledEl.ImportTokenWrapper id="currency-import">
-          {blockchainResult.slice(0, SEARCH_RESULTS_LIMIT).map((token) => {
-            return <ImportTokenItem key={token.address} token={token} importToken={importToken} />
-          })}
-        </styledEl.ImportTokenWrapper>
-      ) : null}
-
-      {/*Tokens from inactive lists*/}
-      {inactiveListsResult?.length ? (
-        <div>
-          <TokenSourceTitle
-            tooltip={t`Tokens from inactive lists. Import specific tokens below or click Manage to activate more lists.`}
-          >
-            {t`Expanded results from inactive Token Lists`}
-          </TokenSourceTitle>
-          <div>
-            {inactiveListsResult.slice(0, SEARCH_RESULTS_LIMIT).map((token) => {
-              return <ImportTokenItem key={token.address} token={token} importToken={importToken} shadowed />
-            })}
-          </div>
-        </div>
-      ) : null}
-
-      {/*Tokens from external sources*/}
-      {externalApiResult?.length ? (
-        <div>
-          <TokenSourceTitle tooltip={t`Tokens from external sources.`}>
-            {t`Additional Results from External Sources`}
-          </TokenSourceTitle>
-          <div>
-            {externalApiResult.map((token) => {
-              return <ImportTokenItem key={token.address} token={token} importToken={importToken} shadowed />
-            })}
-          </div>
-        </div>
-      ) : null}
-    </>
+  const rows = useSearchRows({
+    isLoading,
+    matchedTokens,
+    activeList,
+    blockchainResult,
+    inactiveListsResult,
+    externalApiResult,
+  })
+
+  const renderRow = useCallback(
+    (items: TokenSearchRow[], virtualItem: VirtualItem) => (
+      <TokenSearchRowRenderer
+        row={items[virtualItem.index]}
+        selectTokenContext={selectTokenContext}
+        importToken={importToken}
+      />
+    ),
+    [importToken, selectTokenContext],
+  )
+
+  if (isLoading)
+    return (
+      <styledEl.LoaderWrapper>
+        <Loader />
+      </styledEl.LoaderWrapper>
+    )
+
+  if (isTokenNotFound)
+    return (
+      <styledEl.TokenNotFound>
+        <Trans>No tokens found</Trans>
+      </styledEl.TokenNotFound>
+    )
+
+  return <VirtualList id="token-search-results" items={rows} getItemView={renderRow} scrollResetKey={searchInput} />
+}
+
+type TokenImportSection = 'blockchain' | 'inactive' | 'external'
+
+type TokenSearchRow =
+  | { type: 'banner' }
+  | { type: 'token'; token: TokenWithLogo }
+  | { type: 'section-title'; text: string; tooltip?: string }
+  | {
+      type: 'import-token'
+      token: TokenWithLogo
+      shadowed?: boolean
+      section: TokenImportSection
+      isFirstInSection: boolean
+      isLastInSection: boolean
+      wrapperId?: string
+    }
+
+interface UseSearchRowsParams {
+  isLoading: boolean
+  matchedTokens: TokenWithLogo[]
+  activeList: TokenWithLogo[]
+  blockchainResult?: TokenWithLogo[]
+  inactiveListsResult?: TokenWithLogo[]
+  externalApiResult?: TokenWithLogo[]
+}
+
+function useSearchRows({
+  isLoading,
+  matchedTokens,
+  activeList,
+  blockchainResult,
+  inactiveListsResult,
+  externalApiResult,
+}: UseSearchRowsParams): TokenSearchRow[] {
+  return useMemo(() => {
+    const entries: TokenSearchRow[] = []
+
+    if (isLoading) {
+      return entries
+    }
+
+    entries.push({ type: 'banner' })
+
+    for (const token of matchedTokens) {
+      entries.push({ type: 'token', token })
+    }
+
+    for (const token of activeList) {
+      entries.push({ type: 'token', token })
+    }
+
+    appendImportSection(entries, {
+      tokens: blockchainResult,
+      section: 'blockchain',
+      limit: SEARCH_RESULTS_LIMIT,
+      sectionTitle: undefined,
+      tooltip: undefined,
+      shadowed: false,
+      wrapperId: 'currency-import',
+    })
+
+    appendImportSection(entries, {
+      tokens: inactiveListsResult,
+      section: 'inactive',
+      limit: SEARCH_RESULTS_LIMIT,
+      sectionTitle: t`Expanded results from inactive Token Lists`,
+      tooltip: t`Tokens from inactive lists. Import specific tokens below or click Manage to activate more lists.`,
+      shadowed: true,
+    })
+
+    appendImportSection(entries, {
+      tokens: externalApiResult,
+      section: 'external',
+      limit: SEARCH_RESULTS_LIMIT,
+      sectionTitle: t`Additional Results from External Sources`,
+      tooltip: t`Tokens from external sources.`,
+      shadowed: true,
+    })
+
+    return entries
+  }, [isLoading, matchedTokens, activeList, blockchainResult, inactiveListsResult, externalApiResult])
+}
+
+interface AppendImportSectionParams {
+  tokens?: TokenWithLogo[]
+  section: TokenImportSection
+  limit: number
+  sectionTitle?: string
+  tooltip?: string
+  shadowed?: boolean
+  wrapperId?: string
+}
+
+function appendImportSection(rows: TokenSearchRow[], params: AppendImportSectionParams): void {
+  const { tokens, section, limit, sectionTitle, tooltip, shadowed, wrapperId } = params
+
+  if (!tokens?.length) {
+    return
+  }
+
+  if (sectionTitle) {
+    rows.push({ type: 'section-title', text: sectionTitle, tooltip })
+  }
+
+  const limitedTokens = tokens.slice(0, limit)
+
+  limitedTokens.forEach((token, index) => {
+    rows.push({
+      type: 'import-token',
+      token,
+      section,
+      shadowed,
+      isFirstInSection: index === 0,
+      isLastInSection: index === limitedTokens.length - 1,
+      wrapperId: index === 0 ? wrapperId : undefined,
+    })
+  })
+}
+
+interface TokenSearchRowRendererProps {
+  row: TokenSearchRow
+  selectTokenContext: SelectTokenContext
+  importToken(token: TokenWithLogo): void
+}
+
+function TokenSearchRowRenderer({ row, selectTokenContext, importToken }: TokenSearchRowRendererProps): ReactNode {
+  switch (row.type) {
+    case 'banner':
+      return <GuideBanner />
+    case 'token':
+      return <TokenListItemContainer token={row.token} context={selectTokenContext} />
+    case 'section-title': {
+      const tooltip = row.tooltip ?? ''
+      return (
+        <styledEl.SectionTitleRow>
+          <TokenSourceTitle tooltip={tooltip}>{row.text}</TokenSourceTitle>
+        </styledEl.SectionTitleRow>
+      )
+    }
+    case 'import-token':
+      return (
+        <ImportTokenItem
+          token={row.token}
+          importToken={importToken}
+          shadowed={row.shadowed}
+          wrapperId={row.wrapperId}
+          isFirstInSection={row.isFirstInSection}
+          isLastInSection={row.isLastInSection}
+        />
+      )
+    default:
+      return null
+  }
+}
+
+function GuideBanner(): ReactNode {
+  return (
+    <InlineBanner
+      margin="10px"
+      width="auto"
+      orientation={BannerOrientation.Horizontal}
+      bannerType={StatusColorVariant.Info}
+    >
+      <p>
+        <Trans>
+          Can't find your token on the list? <ExternalLink href={LINK_GUIDE_ADD_CUSTOM_TOKEN}>Read our guide</ExternalLink>{' '}
+          on how to add custom tokens.
+        </Trans>
+      </p>
+    </InlineBanner>
   )
 }