diff --git a/frontend/language/src/nb.json b/frontend/language/src/nb.json
index 3ee368acdb4..ef531c9464f 100644
--- a/frontend/language/src/nb.json
+++ b/frontend/language/src/nb.json
@@ -1913,6 +1913,10 @@
   "ux_editor.search_text_resources_close": "Lukk tekstsøk",
   "ux_editor.search_text_resources_label": "Velg eksisterende tekst basert på ID",
   "ux_editor.search_text_resources_none": "Ingen",
+  "ux_editor.settings.data_model_tab": "Datamodell",
+  "ux_editor.settings.navigation_tab": "Navigasjon",
+  "ux_editor.settings.other_settings": "Andre innstillinger",
+  "ux_editor.settings.wip_message": "Denne fanen er under utvikling - innhold kommer snart.",
   "ux_editor.show_icon": "Skal ikonet vises?",
   "ux_editor.subdomains_label": "Subdomener (kommaseparert)",
   "ux_editor.subdomains_placeholder": "domene1, domene2, domene3",
diff --git a/frontend/packages/ux-editor/src/components/Settings/SettingsTabs.module.css b/frontend/packages/ux-editor/src/components/Settings/SettingsTabs.module.css
new file mode 100644
index 00000000000..dbc3ae7d9c3
--- /dev/null
+++ b/frontend/packages/ux-editor/src/components/Settings/SettingsTabs.module.css
@@ -0,0 +1,15 @@
+.heading {
+  color: #1e2b3c;
+  font-family: var(--studio-font-family);
+  letter-spacing: 1px;
+  margin-bottom: var(--fds-spacing-7);
+}
+
+.icon {
+  font-size: var(--fds-sizing-6);
+  margin-right: var(--fds-spacing-1);
+}
+
+.wipMessage {
+  display: inline-grid;
+}
diff --git a/frontend/packages/ux-editor/src/components/Settings/SettingsTabs.tsx b/frontend/packages/ux-editor/src/components/Settings/SettingsTabs.tsx
new file mode 100644
index 00000000000..03fdf614f8c
--- /dev/null
+++ b/frontend/packages/ux-editor/src/components/Settings/SettingsTabs.tsx
@@ -0,0 +1,45 @@
+import type { ReactElement } from 'react';
+import React from 'react';
+import { StudioAlert, StudioHeading, StudioTabs } from '@studio/components';
+import { useTranslation } from 'react-i18next';
+import classes from './SettingsTabs.module.css';
+import { CompassIcon, DatabaseIcon } from '@studio/icons';
+
+enum Tabs {
+  Navigation = 'navigation',
+  Database = 'database',
+}
+
+export const SettingsTabs = (): ReactElement => {
+  const { t } = useTranslation();
+
+  return (
+    <div>
+      <StudioHeading level={2} size='xsmall' className={classes.heading}>
+        {t('ux_editor.settings.other_settings')}
+      </StudioHeading>
+      <StudioTabs defaultValue={Tabs.Navigation}>
+        <StudioTabs.List>
+          <StudioTabs.Tab value={Tabs.Navigation}>
+            <CompassIcon className={classes.icon} />
+            {t('ux_editor.settings.navigation_tab')}
+          </StudioTabs.Tab>
+          <StudioTabs.Tab value={Tabs.Database}>
+            <DatabaseIcon className={classes.icon} />
+            {t('ux_editor.settings.data_model_tab')}
+          </StudioTabs.Tab>
+        </StudioTabs.List>
+        <StudioTabs.Content value={Tabs.Navigation}>
+          <StudioAlert severity='info' className={classes.wipMessage}>
+            {t('ux_editor.settings.wip_message')}
+          </StudioAlert>
+        </StudioTabs.Content>
+        <StudioTabs.Content value={Tabs.Database}>
+          <StudioAlert severity='info' className={classes.wipMessage}>
+            {t('ux_editor.settings.wip_message')}
+          </StudioAlert>
+        </StudioTabs.Content>
+      </StudioTabs>
+    </div>
+  );
+};
diff --git a/frontend/packages/ux-editor/src/containers/FormDesignNavigation/FormDesignerNavigation.tsx b/frontend/packages/ux-editor/src/containers/FormDesignNavigation/FormDesignerNavigation.tsx
index 31498bf4b0f..0d781b4ddf7 100644
--- a/frontend/packages/ux-editor/src/containers/FormDesignNavigation/FormDesignerNavigation.tsx
+++ b/frontend/packages/ux-editor/src/containers/FormDesignNavigation/FormDesignerNavigation.tsx
@@ -4,6 +4,7 @@ import classes from './FormDesignerNavigation.module.css';
 import { useTranslation } from 'react-i18next';
 import { useStudioEnvironmentParams } from 'app-shared/hooks/useStudioEnvironmentParams';
 import { useAppConfigQuery } from 'app-development/hooks/queries';
+import { SettingsTabs } from '../../components/Settings/SettingsTabs';
 
 export const FormDesignerNavigation = () => {
   const { t } = useTranslation();
@@ -15,6 +16,7 @@ export const FormDesignerNavigation = () => {
         <div className={classes.panel}>
           <div className={classes.content}>
             <div className={classes.header}>{appConfigData?.serviceName}</div>
+            <SettingsTabs />
           </div>
           <footer className={classes.footer}>
             <Link href='/contact'>{t('general.contact')}</Link>