diff --git a/packages/web/src/javascripts/Components/Preferences/Panes/Vaults/Vaults.tsx b/packages/web/src/javascripts/Components/Preferences/Panes/Vaults/Vaults.tsx
index b55484f71..cb7d2486d 100644
--- a/packages/web/src/javascripts/Components/Preferences/Panes/Vaults/Vaults.tsx
+++ b/packages/web/src/javascripts/Components/Preferences/Panes/Vaults/Vaults.tsx
@@ -27,6 +27,8 @@ import NoProSubscription from '../Account/NoProSubscription'
 const Vaults = () => {
   const application = useApplication()
 
+  const hasAccount = application.hasAccount()
+
   const [vaults, setVaults] = useState<VaultListingInterface[]>([])
   const [canCreateMoreVaults, setCanCreateMoreVaults] = useState(true)
   const [invites, setInvites] = useState<InviteRecord[]>([])
@@ -140,21 +142,23 @@ const Vaults = () => {
         </PreferencesGroup>
       )}
 
-      <PreferencesGroup>
-        <PreferencesSegment>
-          <Title>Contacts</Title>
-          {contacts.length > 0 && (
-            <div className="my-2 flex flex-col gap-3.5">
-              {contacts.map((contact) => {
-                return <ContactItem contact={contact} key={contact.uuid} />
-              })}
+      {hasAccount && (
+        <PreferencesGroup>
+          <PreferencesSegment>
+            <Title>Contacts</Title>
+            {contacts.length > 0 && (
+              <div className="my-2 flex flex-col gap-3.5">
+                {contacts.map((contact) => {
+                  return <ContactItem contact={contact} key={contact.uuid} />
+                })}
+              </div>
+            )}
+            <div className="mt-2.5 flex flex-row">
+              <Button label="Add New Contact" className={'mr-3 text-xs'} onClick={createNewContact} />
             </div>
-          )}
-          <div className="mt-2.5 flex flex-row">
-            <Button label="Add New Contact" className={'mr-3 text-xs'} onClick={createNewContact} />
-          </div>
-        </PreferencesSegment>
-      </PreferencesGroup>
+          </PreferencesSegment>
+        </PreferencesGroup>
+      )}
 
       <PreferencesGroup>
         <PreferencesSegment>
@@ -181,46 +185,48 @@ const Vaults = () => {
         </PreferencesSegment>
       </PreferencesGroup>
 
-      <PreferencesGroup>
-        <PreferencesSegment>
-          <Title>CollaborationID</Title>
-          <Subtitle>Share your CollaborationID with collaborators to join their vaults.</Subtitle>
-          {contactService.isCollaborationEnabled() ? (
-            <>
-              <code className="mt-2.5 overflow-hidden whitespace-pre-wrap break-words rounded border border-border bg-contrast p-3">
-                {contactService.getCollaborationID()}
-              </code>
-              <Button
-                label="Copy ID"
-                className="mt-2"
-                onClick={async () => {
-                  try {
-                    await navigator.clipboard.writeText(contactService.getCollaborationID())
-                    addToast({
-                      type: ToastType.Success,
-                      message: 'Copied to clipboard',
-                    })
-                  } catch (error) {
-                    addToast({
-                      type: ToastType.Error,
-                      message: 'Failed to copy to clipboard',
-                    })
-                    console.error(error)
-                  }
-                }}
-              />
-            </>
-          ) : (
-            <div className="mt-2.5 flex flex-row">
-              <Button
-                label="Enable Vault Sharing"
-                className="mr-3 text-xs"
-                onClick={() => contactService.enableCollaboration()}
-              />
-            </div>
-          )}
-        </PreferencesSegment>
-      </PreferencesGroup>
+      {hasAccount && (
+        <PreferencesGroup>
+          <PreferencesSegment>
+            <Title>CollaborationID</Title>
+            <Subtitle>Share your CollaborationID with collaborators to join their vaults.</Subtitle>
+            {contactService.isCollaborationEnabled() ? (
+              <>
+                <code className="mt-2.5 overflow-hidden whitespace-pre-wrap break-words rounded border border-border bg-contrast p-3">
+                  {contactService.getCollaborationID()}
+                </code>
+                <Button
+                  label="Copy ID"
+                  className="mt-2"
+                  onClick={async () => {
+                    try {
+                      await navigator.clipboard.writeText(contactService.getCollaborationID())
+                      addToast({
+                        type: ToastType.Success,
+                        message: 'Copied to clipboard',
+                      })
+                    } catch (error) {
+                      addToast({
+                        type: ToastType.Error,
+                        message: 'Failed to copy to clipboard',
+                      })
+                      console.error(error)
+                    }
+                  }}
+                />
+              </>
+            ) : (
+              <div className="mt-2.5 flex flex-row">
+                <Button
+                  label="Enable Vault Sharing"
+                  className="mr-3 text-xs"
+                  onClick={() => contactService.enableCollaboration()}
+                />
+              </div>
+            )}
+          </PreferencesSegment>
+        </PreferencesGroup>
+      )}
     </PreferencesPane>
   )
 }
diff --git a/packages/web/src/javascripts/Components/Preferences/Panes/Vaults/Vaults/VaultItem.tsx b/packages/web/src/javascripts/Components/Preferences/Panes/Vaults/Vaults/VaultItem.tsx
index 3f39fdf10..008c7db34 100644
--- a/packages/web/src/javascripts/Components/Preferences/Panes/Vaults/Vaults/VaultItem.tsx
+++ b/packages/web/src/javascripts/Components/Preferences/Panes/Vaults/Vaults/VaultItem.tsx
@@ -138,7 +138,7 @@ const VaultItem = ({ vault }: Props) => {
         <EditVaultModal existingVaultUuid={vault.uuid} onCloseDialog={closeVaultModal} />
       </ModalOverlay>
 
-      <div className="flex flex-row gap-3.5 rounded-lg border border-border px-3.5 py-2.5 shadow">
+      <div className="flex flex-row gap-3.5 rounded-lg border border-border px-3.5 py-2.5 shadow-sm">
         <Icon type={vault.iconString} size="custom" className="mt-2.5 h-5.5 w-5.5 flex-shrink-0" />
         <div className="flex flex-col gap-1.5 py-1.5">
           <span className="mr-auto overflow-hidden text-ellipsis text-base font-bold">{vault.name}</span>
@@ -164,14 +164,14 @@ const VaultItem = ({ vault }: Props) => {
             )}
             {vault.isSharedVaultListing() ? (
               <Button colorStyle="info" label="Invite Contacts" className="text-xs" onClick={openInviteModal} />
-            ) : (
+            ) : application.hasAccount() ? (
               <Button
                 colorStyle="info"
                 label="Enable Collaboration"
                 className="text-xs"
                 onClick={convertToSharedVault}
               />
-            )}
+            ) : null}
           </div>
         </div>
       </div>