diff --git a/apps/admin-x-design-system/src/settings/SettingGroupContent.tsx b/apps/admin-x-design-system/src/settings/SettingGroupContent.tsx
index 744822bede..f2efcf61e7 100644
--- a/apps/admin-x-design-system/src/settings/SettingGroupContent.tsx
+++ b/apps/admin-x-design-system/src/settings/SettingGroupContent.tsx
@@ -14,12 +14,12 @@ export interface SettingGroupContentProps {
 }
 
 const SettingGroupContent: React.FC<SettingGroupContentProps> = ({columns, values, children, className}) => {
-    let styles = 'flex flex-col gap-x-5';
+    let styles = 'flex flex-col gap-x-5 gap-y-7';
     if (columns === 2) {
         styles = 'grid grid-cols-1 md:grid-cols-2 gap-x-8 gap-y-6';
     }
 
-    styles += className ? ` ${className}` : ' gap-y-7';
+    styles += ` ${className}`;
 
     return (
         <div className={styles}>
diff --git a/apps/admin-x-settings/src/components/settings/membership/Access.tsx b/apps/admin-x-settings/src/components/settings/membership/Access.tsx
index 5324517ba3..5994c03109 100644
--- a/apps/admin-x-settings/src/components/settings/membership/Access.tsx
+++ b/apps/admin-x-settings/src/components/settings/membership/Access.tsx
@@ -2,8 +2,8 @@ import React from 'react';
 import TopLevelGroup from '../../TopLevelGroup';
 import useSettingGroup from '../../../hooks/useSettingGroup';
 import {GroupBase, MultiValue} from 'react-select';
-import {MultiSelect, MultiSelectOption, Select, Separator, SettingGroupContent, withErrorBoundary} from '@tryghost/admin-x-design-system';
-// import {getOptionLabel} from '../../../utils/helpers';
+import {MultiSelect, MultiSelectOption, Select, SettingGroupContent, withErrorBoundary} from '@tryghost/admin-x-design-system';
+import {getOptionLabel} from '../../../utils/helpers';
 import {getSettingValues} from '@tryghost/admin-x-framework/api/settings';
 import {useBrowseTiers} from '@tryghost/admin-x-framework/api/tiers';
 
@@ -81,9 +81,9 @@ const Access: React.FC<{ keywords: string[] }> = ({keywords}) => {
         'members_signup_access', 'default_content_visibility', 'default_content_visibility_tiers', 'comments_enabled'
     ]) as string[];
 
-    // const membersSignupAccessLabel = getOptionLabel(MEMBERS_SIGNUP_ACCESS_OPTIONS, membersSignupAccess);
-    // const defaultContentVisibilityLabel = getOptionLabel(DEFAULT_CONTENT_VISIBILITY_OPTIONS, defaultContentVisibility);
-    // const commentsEnabledLabel = getOptionLabel(COMMENTS_ENABLED_OPTIONS, commentsEnabled);
+    const membersSignupAccessLabel = getOptionLabel(MEMBERS_SIGNUP_ACCESS_OPTIONS, membersSignupAccess);
+    const defaultContentVisibilityLabel = getOptionLabel(DEFAULT_CONTENT_VISIBILITY_OPTIONS, defaultContentVisibility);
+    const commentsEnabledLabel = getOptionLabel(COMMENTS_ENABLED_OPTIONS, commentsEnabled);
 
     const {data: {tiers} = {}} = useBrowseTiers();
 
@@ -106,92 +106,71 @@ const Access: React.FC<{ keywords: string[] }> = ({keywords}) => {
         updateSetting('default_content_visibility_tiers', JSON.stringify(selectedTiers));
     };
 
-    // const values = (
-    //     <SettingGroupContent
-    //         values={[
-    //             {
-    //                 heading: 'Subscription access',
-    //                 key: 'subscription-access',
-    //                 value: membersSignupAccessLabel
-    //             },
-    //             {
-    //                 heading: 'Default post access',
-    //                 key: 'default-post-access',
-    //                 value: defaultContentVisibilityLabel
-    //             },
-    //             {
-    //                 heading: 'Commenting',
-    //                 key: 'commenting',
-    //                 value: commentsEnabledLabel
-    //             }
-    //         ]}
-    //     />
-    // );
+    const values = (
+        <SettingGroupContent
+            values={[
+                {
+                    heading: 'Subscription access',
+                    key: 'subscription-access',
+                    value: membersSignupAccessLabel
+                },
+                {
+                    heading: 'Default post access',
+                    key: 'default-post-access',
+                    value: defaultContentVisibilityLabel
+                },
+                {
+                    heading: 'Commenting',
+                    key: 'commenting',
+                    value: commentsEnabledLabel
+                }
+            ]}
+        />
+    );
 
     const form = (
-        <SettingGroupContent className='gap-y-4' columns={1}>
-            <div className="flex flex-col content-center items-center gap-4 md:flex-row">
-                <div className="w-full min-w-[160px] max-w-none md:w-2/3 md:max-w-[320px]">Who should be able to subscribe to your site?</div>
-                <div className="w-full md:flex-1">
-                    <Select 
-                        options={MEMBERS_SIGNUP_ACCESS_OPTIONS}
-                        selectedOption={MEMBERS_SIGNUP_ACCESS_OPTIONS.find(option => option.value === membersSignupAccess)}
-                        testId='subscription-access-select'
-                        onSelect={(option) => {
-                            updateSetting('members_signup_access', option?.value || null);
-                            handleEditingChange(true);
-                        }}
-                    />
-                </div>
-            </div>
-            <Separator />
-            <div className="flex flex-col content-center items-center gap-4 md:flex-row">
-                <div className="w-full min-w-[160px] max-w-none md:w-2/3 md:max-w-[320px]">Who should have access to new posts?</div>
-                <div className="w-full md:flex-1">
-                    <Select
-                        options={DEFAULT_CONTENT_VISIBILITY_OPTIONS}
-                        selectedOption={DEFAULT_CONTENT_VISIBILITY_OPTIONS.find(option => option.value === defaultContentVisibility)}
-                        testId='default-post-access-select'
-                        onSelect={(option) => {
-                            updateSetting('default_content_visibility', option?.value || null);
-                            handleEditingChange(true);
-                        }}
-                    />
-                </div>
-            </div>
+        <SettingGroupContent columns={1}>
+            <Select
+                hint='Who should be able to subscribe to your site?'
+                options={MEMBERS_SIGNUP_ACCESS_OPTIONS}
+                selectedOption={MEMBERS_SIGNUP_ACCESS_OPTIONS.find(option => option.value === membersSignupAccess)}
+                testId='subscription-access-select'
+                title="Subscription access"
+                onSelect={(option) => {
+                    updateSetting('members_signup_access', option?.value || null);
+                }}
+            />
+            <Select
+                hint='When a new post is created, who should have access?'
+                options={DEFAULT_CONTENT_VISIBILITY_OPTIONS}
+                selectedOption={DEFAULT_CONTENT_VISIBILITY_OPTIONS.find(option => option.value === defaultContentVisibility)}
+                testId='default-post-access-select'
+                title="Default post access"
+                onSelect={(option) => {
+                    updateSetting('default_content_visibility', option?.value || null);
+                }}
+            />
             {defaultContentVisibility === 'tiers' && (
-                <div className="flex flex-col content-center items-center gap-4 md:flex-row">
-                    <div className="w-full min-w-[160px] max-w-none md:w-2/3 md:max-w-[320px]">Select specific tiers</div>
-                    <div className="w-full md:flex-1">
-                        <MultiSelect
-                            color='black'
-                            options={tierOptionGroups.filter(group => group.options.length > 0)}
-                            testId='tiers-select'
-                            values={selectedTierOptions}
-                            onChange={(selectedOptions) => {
-                                setSelectedTiers(selectedOptions);
-                                handleEditingChange(true);
-                            }}
-                        />
-                    </div>
-                </div>
+                <MultiSelect
+                    color='black'
+                    options={tierOptionGroups.filter(group => group.options.length > 0)}
+                    testId='tiers-select'
+                    title='Select tiers'
+                    values={selectedTierOptions}
+                    clearBg
+                    onChange={setSelectedTiers}
+                />
             )}
-            <Separator />
-            <div className="flex flex-col content-center items-center gap-4 md:flex-row">
-                <div className="w-full min-w-[160px] max-w-none md:w-2/3 md:max-w-[320px]">Who can comment on posts?</div>
-                <div className="w-full md:flex-1">
-                    <Select
-                        options={COMMENTS_ENABLED_OPTIONS}
-                        selectedOption={COMMENTS_ENABLED_OPTIONS.find(option => option.value === commentsEnabled)}
-                        testId='commenting-select'
-                        title=""
-                        onSelect={(option) => {
-                            updateSetting('comments_enabled', option?.value || null);
-                            handleEditingChange(true);
-                        }}
-                    />
-                </div>
-            </div>
+            <Select
+                hint='Who can comment on posts?'
+                options={COMMENTS_ENABLED_OPTIONS}
+                selectedOption={COMMENTS_ENABLED_OPTIONS.find(option => option.value === commentsEnabled)}
+                testId='commenting-select'
+                title="Commenting"
+                onSelect={(option) => {
+                    updateSetting('comments_enabled', option?.value || null);
+                }}
+            />
         </SettingGroupContent>
     );
 
@@ -204,12 +183,11 @@ const Access: React.FC<{ keywords: string[] }> = ({keywords}) => {
             saveState={saveState}
             testId='access'
             title='Access'
-            hideEditButton
             onCancel={handleCancel}
             onEditingChange={handleEditingChange}
             onSave={handleSave}
         >
-            {form}
+            {isEditing ? form : values}
         </TopLevelGroup>
     );
 };
diff --git a/apps/admin-x-settings/test/acceptance/membership/access.test.ts b/apps/admin-x-settings/test/acceptance/membership/access.test.ts
index 973dd02189..7d53b508cd 100644
--- a/apps/admin-x-settings/test/acceptance/membership/access.test.ts
+++ b/apps/admin-x-settings/test/acceptance/membership/access.test.ts
@@ -21,12 +21,16 @@ test.describe('Access settings', async () => {
         await expect(section.getByText('Public')).toHaveCount(1);
         await expect(section.getByText('Nobody')).toHaveCount(1);
 
+        await section.getByRole('button', {name: 'Edit'}).click();
+
         await chooseOptionInSelect(section.getByTestId('subscription-access-select'), 'Only people I invite');
         await chooseOptionInSelect(section.getByTestId('default-post-access-select'), /^Members only$/);
         await chooseOptionInSelect(section.getByTestId('commenting-select'), 'All members');
 
         await section.getByRole('button', {name: 'Save'}).click();
 
+        await expect(section.getByTestId('subscription-access-select')).toHaveCount(0);
+
         await expect(section.getByText('Only people I invite')).toHaveCount(1);
         await expect(section.getByText('Members only')).toHaveCount(1);
         await expect(section.getByText('All members')).toHaveCount(1);
@@ -52,6 +56,8 @@ test.describe('Access settings', async () => {
 
         const section = page.getByTestId('access');
 
+        await section.getByRole('button', {name: 'Edit'}).click();
+
         await chooseOptionInSelect(section.getByTestId('subscription-access-select'), 'Nobody');
 
         await section.getByRole('button', {name: 'Save'}).click();
@@ -62,7 +68,7 @@ test.describe('Access settings', async () => {
             ]
         });
 
-        await expect(section.getByTestId('subscription-access-select')).toContainText('Nobody');
+        await expect(section.getByTestId('subscription-access-select')).toHaveCount(0);
 
         await expect(page.getByTestId('portal').getByRole('button', {name: 'Customize'})).toBeDisabled();
         await expect(page.getByTestId('enable-newsletters')).toContainText('only existing members will receive newsletters');
@@ -82,6 +88,8 @@ test.describe('Access settings', async () => {
 
         const section = page.getByTestId('access');
 
+        await section.getByRole('button', {name: 'Edit'}).click();
+
         await chooseOptionInSelect(section.getByTestId('default-post-access-select'), 'Specific tiers');
         await section.getByTestId('tiers-select').click();
 
@@ -90,7 +98,7 @@ test.describe('Access settings', async () => {
 
         await section.getByRole('button', {name: 'Save'}).click();
 
-        await expect(section.getByTestId('default-post-access-select')).toContainText('Specific tiers');
+        await expect(section.getByText('Specific tiers')).toHaveCount(1);
 
         expect(lastApiRequests.editSettings?.body).toEqual({
             settings: [