diff --git a/CHANGELOG.md b/CHANGELOG.md
index f76de79e..a121b0e7 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -16,6 +16,7 @@ and this project adheres to
 
 - 📈(frontend) track new recording's modes
 - ♿️(frontend) improve SR and focus for transcript and recording #810
+- 💄(frontend) adjust spacing in the recording side panels
 - 🚸(frontend) remove the default comma delimiter in humanized durations
 
 ### Fixed
diff --git a/src/frontend/src/features/recording/components/ScreenRecordingSidePanel.tsx b/src/frontend/src/features/recording/components/ScreenRecordingSidePanel.tsx
index be12d36b..0589106a 100644
--- a/src/frontend/src/features/recording/components/ScreenRecordingSidePanel.tsx
+++ b/src/frontend/src/features/recording/components/ScreenRecordingSidePanel.tsx
@@ -145,7 +145,7 @@ export const ScreenRecordingSidePanel = () => {
           },
         })}
       />
-      <VStack gap={0} marginBottom={30}>
+      <VStack gap={0} marginBottom={15}>
         <H lvl={1} margin={'sm'} fullWidth>
           {t('heading')}
         </H>
@@ -162,7 +162,7 @@ export const ScreenRecordingSidePanel = () => {
           )}
         </Text>
       </VStack>
-      <VStack gap={0} marginBottom={40}>
+      <VStack gap={0} marginBottom={25}>
         <RowWrapper iconName="cloud_download" position="first">
           <Text variant="sm">{t('details.destination')}</Text>
         </RowWrapper>
diff --git a/src/frontend/src/features/recording/components/TranscriptSidePanel.tsx b/src/frontend/src/features/recording/components/TranscriptSidePanel.tsx
index d608ab9a..a19ce3aa 100644
--- a/src/frontend/src/features/recording/components/TranscriptSidePanel.tsx
+++ b/src/frontend/src/features/recording/components/TranscriptSidePanel.tsx
@@ -181,7 +181,7 @@ export const TranscriptSidePanel = () => {
           },
         })}
       />
-      <VStack gap={0} marginBottom={30}>
+      <VStack gap={0} marginBottom={15}>
         <H lvl={1} margin={'sm'}>
           {t('heading')}
         </H>
@@ -198,7 +198,7 @@ export const TranscriptSidePanel = () => {
           )}
         </Text>
       </VStack>
-      <VStack gap={0} marginBottom={40}>
+      <VStack gap={0} marginBottom={25}>
         <RowWrapper iconName="article" position="first">
           <Text variant="sm">
             {data?.transcription_destination ? (