diff --git a/src/routes/Settings/Settings.js b/src/routes/Settings/Settings.js
index cc42afc6b..2d29c9f33 100644
--- a/src/routes/Settings/Settings.js
+++ b/src/routes/Settings/Settings.js
@@ -327,6 +327,10 @@ const Settings = () => {
                     </div>
                     <div ref={playerSectionRef} className={styles['section-container']}>
                         <div className={styles['section-title']}>{ t('SETTINGS_NAV_PLAYER') }</div>
+                        <div className={styles['section-subtitle-wrapper']}>
+                            <Icon className={styles['icon']} name={'subtitles'} />
+                            <div className={styles['section-subtitle']}>{t('SETTINGS_SECTION_SUBTITLES')}</div>
+                        </div>
                         <div className={styles['option-container']}>
                             <div className={styles['option-name-container']}>
                                 <div className={styles['label']}>{ t('SETTINGS_SUBTITLES_LANGUAGE') }</div>
@@ -386,6 +390,12 @@ const Settings = () => {
                                 {...subtitlesOutlineColorInput}
                             />
                         </div>
+                    </div>
+                    <div className={styles['section-container']}>
+                        <div className={styles['section-subtitle-wrapper']}>
+                            <Icon className={styles['icon']} name={'volume-medium'} />
+                            <div className={styles['section-subtitle']}>{t('SETTINGS_SECTION_AUDIO')}</div>
+                        </div>
                         <div className={styles['option-container']}>
                             <div className={styles['option-name-container']}>
                                 <div className={styles['label']}>{ t('SETTINGS_DEFAULT_AUDIO_TRACK') }</div>
@@ -395,6 +405,12 @@ const Settings = () => {
                                 {...audioLanguageSelect}
                             />
                         </div>
+                    </div>
+                    <div className={styles['section-container']}>
+                        <div className={styles['section-subtitle-wrapper']}>
+                            <Icon className={styles['icon']} name={'remote'} />
+                            <div className={styles['section-subtitle']}>{t('SETTINGS_SECTION_CONTROLS')}</div>
+                        </div>
                         <div className={styles['option-container']}>
                             <div className={styles['option-name-container']}>
                                 <div className={styles['label']}>{ t('SETTINGS_SEEK_KEY') }</div>
@@ -413,6 +429,23 @@ const Settings = () => {
                                 {...seekShortTimeDurationSelect}
                             />
                         </div>
+                        <div className={styles['option-container']}>
+                            <div className={styles['option-name-container']}>
+                                <div className={styles['label']}>{ t('SETTINGS_PLAY_IN_BACKGROUND') }</div>
+                            </div>
+                            <Checkbox
+                                className={classnames(styles['option-input-container'], styles['checkbox-container'])}
+                                disabled={true}
+                                tabIndex={-1}
+                                {...playInBackgroundCheckbox}
+                            />
+                        </div>
+                    </div>
+                    <div className={styles['section-container']}>
+                        <div className={styles['section-subtitle-wrapper']}>
+                            <Icon className={styles['icon']} name={'play'} />
+                            <div className={styles['section-subtitle']}>{t('SETTINGS_SECTION_AUTO_PLAY')}</div>
+                        </div>
                         <div className={styles['option-container']}>
                             <div className={styles['option-name-container']}>
                                 <div className={styles['label']}>{ t('AUTO_PLAY') }</div>
@@ -432,16 +465,11 @@ const Settings = () => {
                                 {...nextVideoPopupDurationSelect}
                             />
                         </div>
-                        <div className={styles['option-container']}>
-                            <div className={styles['option-name-container']}>
-                                <div className={styles['label']}>{ t('SETTINGS_PLAY_IN_BACKGROUND') }</div>
-                            </div>
-                            <Checkbox
-                                className={classnames(styles['option-input-container'], styles['checkbox-container'])}
-                                disabled={true}
-                                tabIndex={-1}
-                                {...playInBackgroundCheckbox}
-                            />
+                    </div>
+                    <div className={styles['section-container']}>
+                        <div className={styles['section-subtitle-wrapper']}>
+                            <Icon className={styles['icon']} name={'glasses'} />
+                            <div className={styles['section-subtitle']}>{t('SETTINGS_SECTION_ADVANCED')}</div>
                         </div>
                         <div className={styles['option-container']}>
                             <div className={styles['option-name-container']}>
diff --git a/src/routes/Settings/styles.less b/src/routes/Settings/styles.less
index ab2886ba8..41b7a6af0 100644
--- a/src/routes/Settings/styles.less
+++ b/src/routes/Settings/styles.less
@@ -95,10 +95,32 @@
                     align-self: stretch;
                     font-size: 1.8rem;
                     line-height: 3.4rem;
-                    margin-bottom: 1rem;
+                    margin-bottom: 3rem;
                     color: var(--primary-foreground-color);
                 }
 
+                .section-subtitle-wrapper {
+                    display: flex;
+                    flex-direction: row;
+                    align-items: center;
+                    gap: 0 1em;
+                    margin-bottom: 1.5rem;
+                    line-height: 2.4rem;
+
+                    .section-subtitle {
+                        flex: none;
+                        font-size: 1.1rem;
+                        color: var(--primary-foreground-color);
+                    }
+
+                    .icon {
+                        flex: none;
+                        width: 2rem;
+                        height: 2rem;
+                        color: var(--primary-foreground-color);
+                    }
+                }
+
                 .option-container {
                     flex: none;
                     align-self: stretch;