diff --git a/app/soapbox/features/chats/index.tsx b/app/soapbox/features/chats/index.tsx
index aa68db8c2..d389af8e5 100644
--- a/app/soapbox/features/chats/index.tsx
+++ b/app/soapbox/features/chats/index.tsx
@@ -35,8 +35,11 @@ const ChatIndex: React.FC = () => {
 
   return (
     <Card className='p-0 h-[calc(100vh-176px)] overflow-hidden' variant='rounded'>
-      <div className='grid grid-cols-9 overflow-hidden h-full'>
-        <Stack className='col-span-3 p-6 bg-gradient-to-r from-white to-gray-100 overflow-hidden' space={6}>
+      <div className='grid grid-cols-9 overflow-hidden h-full dark:divide-x-2 dark:divide-solid dark:divide-gray-800'>
+        <Stack
+          className='col-span-3 p-6 bg-gradient-to-r from-white to-gray-100 dark:bg-gray-900 dark:bg-none overflow-hidden dark:inset'
+          space={6}
+        >
           <CardTitle title={intl.formatMessage(messages.title)} />
 
           <AccountSearch
@@ -48,6 +51,7 @@ const ChatIndex: React.FC = () => {
             <ChatList onClickChat={handleClickChat} />
           </Stack>
         </Stack>
+
         <Stack className='col-span-6 h-full overflow-hidden'>
           {chat && (
             <Stack className='h-full overflow-hidden'>