diff --git a/src/altinn-app-frontend/__mocks__/formLayoutStateMock.ts b/src/altinn-app-frontend/__mocks__/formLayoutStateMock.ts
index af4c5f04eb..601e3f11f6 100644
--- a/src/altinn-app-frontend/__mocks__/formLayoutStateMock.ts
+++ b/src/altinn-app-frontend/__mocks__/formLayoutStateMock.ts
@@ -1,4 +1,5 @@
 import { ILayoutState } from '../src/features/form/layout/formLayoutSlice';
+import { getUiConfigStateMock } from './uiConfigStateMock';
 
 export function getFormLayoutStateMock(customStates?: Partial<ILayoutState>): ILayoutState {
   const mockFormLayoutState: ILayoutState = {
@@ -46,21 +47,7 @@ export function getFormLayoutStateMock(customStates?: Partial<ILayoutState>): IL
       ],
     },
     error: null,
-    uiConfig: {
-      autoSave: true,
-      focus: null,
-      hiddenFields: [],
-      repeatingGroups: {
-        group: {
-          index: 1,
-          dataModelBinding: 'someGroup',
-        }
-      },
-      fileUploadersWithTag: null,
-      currentView: 'FormLayout',
-      navigationConfig: {},
-      layoutOrder: ['FormLayout'],
-    },
+    uiConfig: getUiConfigStateMock(),
     layoutsets: null,
   };
 
diff --git a/src/altinn-app-frontend/__mocks__/initialStateMock.ts b/src/altinn-app-frontend/__mocks__/initialStateMock.ts
index 30a4d6d228..21e82ec8cf 100644
--- a/src/altinn-app-frontend/__mocks__/initialStateMock.ts
+++ b/src/altinn-app-frontend/__mocks__/initialStateMock.ts
@@ -20,7 +20,9 @@ export const mockParty: IParty = {
   childParties: null,
 };
 
-export function getInitialStateMock(customStates?: Partial<IRuntimeState>): IRuntimeState {
+export function getInitialStateMock(
+  customStates?: Partial<IRuntimeState>,
+): IRuntimeState {
   const initialState: IRuntimeState = {
     applicationMetadata: {
       applicationMetadata: applicationMetadataMock,
@@ -65,6 +67,7 @@ export function getInitialStateMock(customStates?: Partial<IRuntimeState>): IRun
     },
     language: {
       language: getLanguageFromCode('nb'),
+      selectedAppLanguage: '',
       error: null,
     },
     organisationMetaData: {
@@ -78,19 +81,14 @@ export function getInitialStateMock(customStates?: Partial<IRuntimeState>): IRun
           logo: '',
           orgnr: '',
           homepage: '',
-          environments: [
-            'tt02',
-            'production',
-          ],
+          environments: ['tt02', 'production'],
         },
       },
       error: null,
     },
     party: {
       error: null,
-      parties: [
-        mockParty,
-      ],
+      parties: [mockParty],
       selectedParty: mockParty,
     },
     process: {
@@ -108,7 +106,17 @@ export function getInitialStateMock(customStates?: Partial<IRuntimeState>): IRun
     },
     textResources: {
       resources: [
-        { id: 'option.from.rep.group.label', value: 'The value from the group is: {0}', unparsedValue: 'The value from the group is: {0}', variables: [ { dataSource: 'dataModel.skjema', key: 'someGroup[{0}].labelField' }] }
+        {
+          id: 'option.from.rep.group.label',
+          value: 'The value from the group is: {0}',
+          unparsedValue: 'The value from the group is: {0}',
+          variables: [
+            {
+              dataSource: 'dataModel.skjema',
+              key: 'someGroup[{0}].labelField',
+            },
+          ],
+        },
       ],
       error: null,
       language: 'nb',
diff --git a/src/altinn-app-frontend/__mocks__/statelessAndAllowAnonymousMock.ts b/src/altinn-app-frontend/__mocks__/statelessAndAllowAnonymousMock.ts
new file mode 100644
index 0000000000..cb3ae4709a
--- /dev/null
+++ b/src/altinn-app-frontend/__mocks__/statelessAndAllowAnonymousMock.ts
@@ -0,0 +1,33 @@
+import { IApplicationMetadata } from 'src/shared/resources/applicationMetadata';
+import { IRuntimeState } from 'src/types';
+import { getInitialStateMock } from './initialStateMock';
+
+export const statelessAndAllowAnonymousMock = (allowAnonymous: boolean | undefined) => {
+  const initialState = getInitialStateMock();
+  const initialAppMetadata: IApplicationMetadata = {
+    ...initialState.applicationMetadata.applicationMetadata,
+    onEntry: {
+      show: 'stateless',
+    },
+  };
+  initialAppMetadata.dataTypes[0].appLogic.allowAnonymousOnStateless = allowAnonymous;
+  const mockInitialState: IRuntimeState = {
+    ...initialState,
+    applicationMetadata: {
+      applicationMetadata: initialAppMetadata,
+      error: null,
+    },
+    formLayout: {
+      ...initialState.formLayout,
+      layoutsets: {
+        sets: [
+          {
+            id: 'stateless',
+            dataType: 'test-data-model',
+          },
+        ],
+      },
+    },
+  };
+  return mockInitialState;
+};
diff --git a/src/altinn-app-frontend/__mocks__/uiConfigStateMock.ts b/src/altinn-app-frontend/__mocks__/uiConfigStateMock.ts
new file mode 100644
index 0000000000..9e24c5e0c9
--- /dev/null
+++ b/src/altinn-app-frontend/__mocks__/uiConfigStateMock.ts
@@ -0,0 +1,20 @@
+import { IUiConfig } from 'src/types';
+
+export const getUiConfigStateMock = (customStates?: Partial<IUiConfig>): IUiConfig=>{
+  return {
+    autoSave: true,
+    focus: null,
+    hiddenFields: [],
+    repeatingGroups: {
+      group: {
+        index: 1,
+        dataModelBinding: 'someGroup',
+      }
+    },
+    fileUploadersWithTag: null,
+    currentView: 'FormLayout',
+    navigationConfig: {},
+    layoutOrder: ['FormLayout'],
+    ...customStates
+  }
+}
diff --git a/src/altinn-app-frontend/src/components/base/DropdownComponent.tsx b/src/altinn-app-frontend/src/components/base/DropdownComponent.tsx
index 56f37b0e9e..96be2ee041 100644
--- a/src/altinn-app-frontend/src/components/base/DropdownComponent.tsx
+++ b/src/altinn-app-frontend/src/components/base/DropdownComponent.tsx
@@ -1,15 +1,9 @@
 import React from 'react';
-import cn from 'classnames';
-import { makeStyles } from '@material-ui/core';
-
-import { AltinnAppTheme } from 'altinn-shared/theme';
 import { useAppSelector, useHasChangedIgnoreUndefined } from 'src/common/hooks';
 import { IComponentProps } from '..';
-
-import '../../styles/shared.css';
 import type { IMapping, IOptionSource } from 'src/types';
 import { getOptionLookupKey } from 'src/utils/options';
-import { AltinnSpinner } from 'altinn-shared/components';
+import { AltinnSpinner, Select } from 'altinn-shared/components';
 import { useGetOptions } from '../hooks';
 
 export interface IDropdownProps extends IComponentProps {
@@ -19,19 +13,6 @@ export interface IDropdownProps extends IComponentProps {
   source?: IOptionSource;
 }
 
-const useStyles = makeStyles({
-  select: {
-    fontSize: '1.6rem',
-    '&:focus': {
-      outline: `2px solid ${AltinnAppTheme.altinnPalette.primary.blueDark}`,
-    },
-  },
-});
-
-const optionStyle = {
-  display: 'none',
-};
-
 function DropdownComponent({
   optionsId,
   formData,
@@ -44,7 +25,6 @@ function DropdownComponent({
   mapping,
   source,
 }: IDropdownProps) {
-  const classes = useStyles();
   const options = useGetOptions({ optionsId, mapping, source });
   const fetchingOptions = useAppSelector(
     (state) =>
@@ -89,26 +69,23 @@ function DropdownComponent({
       {fetchingOptions ? (
         <AltinnSpinner />
       ) : (
-        <select
+        <Select
           id={id}
-          value={formData?.simpleBinding}
-          disabled={readOnly}
-          className={cn(classes.select, 'custom-select a-custom-select', {
-            'validation-error': !isValid,
-            'disabled !important': readOnly,
-          })}
           onChange={handleChange}
           onBlur={handleBlur}
-        >
-          <option style={optionStyle} />
-          {options?.map((option, index) => (
-            <option key={index} value={option.value}>
-              {getTextResourceAsString(option.label)}
-            </option>
-          ))}
-        </select>
+          value={formData?.simpleBinding}
+          disabled={readOnly}
+          error={!isValid}
+          options={
+            options?.map((option) => ({
+              label: getTextResourceAsString(option.label),
+              value: option.value,
+            })) || []
+          }
+        />
       )}
     </>
   );
 }
+
 export default DropdownComponent;
diff --git a/src/altinn-app-frontend/src/components/presentation/CloseButton.tsx b/src/altinn-app-frontend/src/components/presentation/CloseButton.tsx
new file mode 100644
index 0000000000..3742d75148
--- /dev/null
+++ b/src/altinn-app-frontend/src/components/presentation/CloseButton.tsx
@@ -0,0 +1,27 @@
+import { getLanguageFromKey } from 'altinn-shared/utils';
+import * as React from 'react';
+import { useAppSelector } from 'src/common/hooks';
+
+interface CloseButtonProps {
+  handleClose: () => void;
+};
+
+export const CloseButton = ({ handleClose }: CloseButtonProps) => {
+  const language = useAppSelector(state => state.language.language || {});
+  return <button
+    type='button'
+    className='a-modal-close a-js-tabable-popover ml-1'
+    aria-label={getLanguageFromKey('general.close_schema', language)}
+    onClick={handleClose}
+  >
+      <span className='ai-stack'>
+        <i
+          className='ai-stack-1x ai ai-exit  a-modal-close-icon'
+          aria-hidden='true'
+        />
+      </span>
+    <span className='sr-only'>
+        {getLanguageFromKey('general.close_schema', language)}
+      </span>
+  </button>;
+};
diff --git a/src/altinn-app-frontend/src/components/presentation/LanguageSelector.tsx b/src/altinn-app-frontend/src/components/presentation/LanguageSelector.tsx
new file mode 100644
index 0000000000..c735d8a667
--- /dev/null
+++ b/src/altinn-app-frontend/src/components/presentation/LanguageSelector.tsx
@@ -0,0 +1,54 @@
+import { getTextFromAppOrDefault } from 'src/utils/textResource';
+import { AltinnSpinner, Select } from 'altinn-shared/components';
+import { Box } from '@material-ui/core';
+import * as React from 'react';
+import { useAppSelector } from 'src/common/hooks';
+import { useGetAppLanguageQuery } from 'src/services/LanguageApi';
+import { LanguageActions } from 'src/shared/resources/language/languageSlice';
+import { useDispatch } from 'react-redux';
+import { appLanguageStateSelector } from 'src/selectors/appLanguageStateSelector';
+
+export const LanguageSelector = () => {
+  const language = useAppSelector(state => state.language.language || {});
+  const { isSuccess, data, isLoading } = useGetAppLanguageQuery();
+  const selectedAppLanguage = useAppSelector(
+    appLanguageStateSelector,
+  );
+
+  const textResources = useAppSelector(state => state.textResources.resources);
+  const dispatch = useDispatch();
+  const handleAppLanguageChange = (languageCode: string) => {
+    dispatch(LanguageActions.updateSelectedAppLanguage({ selected: languageCode }));
+  };
+
+
+  return <Box display='flex' flexDirection='column' className='mb-1'>
+    {isLoading && <AltinnSpinner />}
+    {isSuccess && <>
+      <label className='a-form-label' htmlFor='app-language-select'>
+        {getTextFromAppOrDefault(
+          'language.selector.label',
+          textResources,
+          language,
+          null,
+          true,
+        )}
+      </label>
+      <Select
+        options={data.map((l) => ({
+          value: l.language,
+          label: getTextFromAppOrDefault(
+            'language.full_name.' + l.language,
+            textResources,
+            language,
+            null,
+            true,
+          ),
+        }))}
+        onChange={(ev) => handleAppLanguageChange(ev.target.value)}
+        value={selectedAppLanguage}
+        id='app-language-select'
+      />
+    </>}
+  </Box>;
+};
diff --git a/src/altinn-app-frontend/src/components/presentation/NavBar.test.tsx b/src/altinn-app-frontend/src/components/presentation/NavBar.test.tsx
index 7da7f201e2..0f4062aaee 100644
--- a/src/altinn-app-frontend/src/components/presentation/NavBar.test.tsx
+++ b/src/altinn-app-frontend/src/components/presentation/NavBar.test.tsx
@@ -1,26 +1,135 @@
-import { mount } from 'enzyme';
 import React from 'react';
 import NavBar from './NavBar';
+import { screen, waitForElementToBeRemoved } from '@testing-library/react';
+import userEvent from '@testing-library/user-event';
+import { renderWithProviders, setupServer } from '../../../testUtils';
+import { rest } from 'msw';
+import { getLanguageFromCode } from 'altinn-shared/language';
+import { getUiConfigStateMock } from '../../../__mocks__/uiConfigStateMock';
+import { getFormLayoutStateMock } from '../../../__mocks__/formLayoutStateMock';
+import { IAppLanguage } from 'altinn-shared/types';
+import { ITextResource } from 'src/types';
+
+
+const server = setupServer();
+
+beforeAll(() => server.listen({ onUnhandledRequest: 'error' }));
+afterEach(() => server.resetHandlers());
+afterAll(() => server.close());
+
+interface RenderNavBarProps {
+  showBackArrow: boolean;
+  hideCloseButton: boolean;
+  showLanguageSelector: boolean;
+  languageResponse?: IAppLanguage[];
+  textResources?: ITextResource[];
+}
+
+const renderNavBar = ({
+                        hideCloseButton,
+                        showBackArrow,
+                        showLanguageSelector,
+                        languageResponse = [],
+                        textResources = [],
+                      }: RenderNavBarProps) => {
+  const mockClose = jest.fn();
+  const mockBack = jest.fn();
+  const mockAppLanguageChange = jest.fn();
+  server.use(rest.get(
+    /\/applicationlanguages/,
+    (req, res, ctx) => {
+      return res(ctx.json(languageResponse));
+    },
+  ));
+  renderWithProviders(
+    <NavBar
+      handleClose={mockClose}
+      handleBack={mockBack}
+      showBackArrow={showBackArrow}
+    />, {
+      preloadedState: {
+        language: {
+          selectedAppLanguage: 'nb',
+          language: getLanguageFromCode('nb'),
+          error: null,
+        },
+        textResources: { resources: textResources, language: 'nb', error: null },
+        formLayout: getFormLayoutStateMock({
+          uiConfig: getUiConfigStateMock({
+            hideCloseButton,
+            showLanguageSelector,
+          }),
+        }),
+      },
+    },
+  );
+
+
+  return { mockClose, mockBack, mockAppLanguageChange };
+};
 
 describe('components/presentation/NavBar.tsx', () => {
-  it('should render back button by default', () => {
-    const wrapper = mount(
-      <NavBar language={{}} handleClose={null} handleBack={null} />,
-    );
-    expect(wrapper.find('nav.a-modal-navbar')).toHaveLength(1);
-    expect(wrapper.find('button.a-modal-close')).toHaveLength(1);
+
+  it('should render nav', () => {
+    renderNavBar({ hideCloseButton: true, showBackArrow: false, showLanguageSelector: false });
+    screen.getByRole('navigation', {name:/Appnavigasjon/i})
+  });
+
+  it('should render close button', async () => {
+    const { mockClose } = renderNavBar({ hideCloseButton: false, showBackArrow: false, showLanguageSelector: false });
+    const closeButton = screen.getByRole('button', { name: /Lukk Skjema/i });
+    await userEvent.click(closeButton);
+    expect(mockClose).toHaveBeenCalled();
   });
 
-  it('should not render back button when hideBackButton is supplied', () => {
-    const wrapper = mount(
-      <NavBar
-        language={{}}
-        handleClose={null}
-        handleBack={null}
-        hideCloseButton={true}
-      />,
-    );
-    expect(wrapper.find('nav.a-modal-navbar')).toHaveLength(1);
-    expect(wrapper.find('button.a-modal-close')).toHaveLength(0);
+  it('should hide close button and back button', () => {
+    renderNavBar({ hideCloseButton: true, showBackArrow: false, showLanguageSelector: false });
+    expect(screen.queryAllByRole('button')).toHaveLength(0);
+    expect(screen.queryByTestId('altinn-back-button')).toBeNull();
+  });
+
+  it('should render back button', async () => {
+    const { mockBack } = renderNavBar({ hideCloseButton: true, showBackArrow: true, showLanguageSelector: false });
+    const backButton = screen.getByTestId('altinn-back-button');
+    await userEvent.click(backButton);
+    expect(mockBack).toHaveBeenCalled();
+  });
+  it('should render and change app language', async () => {
+    renderNavBar({
+      hideCloseButton: false,
+      showBackArrow: true,
+      showLanguageSelector: true,
+      languageResponse: [{ language: 'en' }, { language: 'nb' }],
+    });
+    await waitForElementToBeRemoved(screen.queryByRole('progressbar'));
+    const dropdown = screen.getByRole('combobox', { name: /Språk/i });
+    await userEvent.selectOptions(dropdown, 'en');
+    expect(dropdown).toHaveValue('en');
+  });
+  it('should render app language with custom labels', async () => {
+    renderNavBar({
+      hideCloseButton: false,
+      showBackArrow: true,
+      showLanguageSelector: true,
+      textResources: [
+        {
+          id: 'language.selector.label',
+          value: 'Velg språk test',
+        },
+        {
+          id: 'language.full_name.nb',
+          value: 'Norsk test',
+        },
+        {
+          id: 'language.full_name.en',
+          value: 'Engelsk test',
+        },
+      ],
+      languageResponse: [{ language: 'en' }, { language: 'nb' }],
+    });
+    await waitForElementToBeRemoved(screen.queryByRole('progressbar'));
+    screen.getByRole('combobox', { name: /Velg språk test/i });
+    screen.getByRole("option", {name:/Norsk test/i})
+    screen.getByRole("option", {name:/Engelsk test/i})
   });
 });
diff --git a/src/altinn-app-frontend/src/components/presentation/NavBar.tsx b/src/altinn-app-frontend/src/components/presentation/NavBar.tsx
index f06c3a9902..fc58bfef46 100644
--- a/src/altinn-app-frontend/src/components/presentation/NavBar.tsx
+++ b/src/altinn-app-frontend/src/components/presentation/NavBar.tsx
@@ -1,49 +1,60 @@
 import * as React from 'react';
 import { getLanguageFromKey } from 'altinn-shared/utils';
-import { ILanguage } from 'altinn-shared/types';
+import { Box } from '@material-ui/core';
+import { useAppSelector } from 'src/common/hooks';
+import { CloseButton } from 'src/components/presentation/CloseButton';
+import { LanguageSelector } from 'src/components/presentation/LanguageSelector';
 
 export interface INavBarProps {
-  language: ILanguage;
-  handleClose: (e: any) => void;
+  handleClose: () => void;
   handleBack: (e: any) => void;
   showBackArrow?: boolean;
-  hideCloseButton?: boolean;
 }
 
 const NavBar = (props: INavBarProps) => {
+  const hideCloseButton = useAppSelector(state => state.formLayout.uiConfig.hideCloseButton);
+  const language = useAppSelector(state => state.language.language || {});
+
+  const showLanguageSelector = useAppSelector(
+    (state) => state.formLayout.uiConfig.showLanguageSelector,
+  );
   return (
-    <nav className='a-modal-navbar' aria-label={getLanguageFromKey('navigation.main', props.language)}>
-      {props.showBackArrow &&
-        <button
-          type='button'
-          className='a-modal-back a-js-tabable-popover'
-          aria-label={getLanguageFromKey('general.back', props.language)}
-          onClick={props.handleBack}
-        >
-          <span className='ai-stack'>
-            <i className='ai-stack-1x ai ai-back' aria-hidden='true' />
-          </span>
-          <span className='hidden-button-text'>
-            {getLanguageFromKey('general.back', props.language)}
-          </span>
-        </button>
-      }
-      {!props.hideCloseButton &&
-        <button
-          type='button'
-          className='a-modal-close a-js-tabable-popover'
-          aria-label={getLanguageFromKey('general.close_schema', props.language)}
-          onClick={props.handleClose}
-        >
-          <span className='ai-stack'>
-            <i className='ai-stack-1x ai ai-exit  a-modal-close-icon' aria-hidden='true' />
-          </span>
-          <span className='hidden-button-text'>
-            {getLanguageFromKey('general.close_schema', props.language)}
-          </span>
-        </button>
-      }
-    </nav>
+    <Box
+      component={"nav"}
+      aria-label={getLanguageFromKey('navigation.main', language)}
+      width={'100%'}
+      display='flex'
+      justifyContent={'space-between'}
+      alignItems={'flex-end'}
+      className='mt-3'
+    >
+      <div>
+        {props.showBackArrow && (
+          <button
+            data-testid='altinn-back-button'
+            type='button'
+            className='a-modal-back a-js-tabable-popover'
+            aria-label={getLanguageFromKey('general.back', language)}
+            onClick={props.handleBack}
+          >
+            <span className='ai-stack'>
+              <i className='ai-stack-1x ai ai-back' aria-hidden='true' />
+            </span>
+            <span className='sr-only'>
+              {getLanguageFromKey('general.back', language)}
+            </span>
+          </button>
+        )}
+      </div>
+
+      <Box display='flex' alignItems={'end'}>
+        {showLanguageSelector && (
+          <LanguageSelector/>
+        )}
+
+        {!hideCloseButton && <CloseButton handleClose={props.handleClose}/>}
+      </Box>
+    </Box>
   );
 };
 
diff --git a/src/altinn-app-frontend/src/features/form/layout/formLayoutSlice.ts b/src/altinn-app-frontend/src/features/form/layout/formLayoutSlice.ts
index bd6561f05f..65e50cf531 100644
--- a/src/altinn-app-frontend/src/features/form/layout/formLayoutSlice.ts
+++ b/src/altinn-app-frontend/src/features/form/layout/formLayoutSlice.ts
@@ -57,6 +57,7 @@ const formLayoutSlice = createSlice({
       const { settings } = action.payload;
       if (settings && settings.pages) {
         state.uiConfig.hideCloseButton = settings?.pages?.hideCloseButton;
+        state.uiConfig.showLanguageSelector = settings?.pages?.showLanguageSelector;
         state.uiConfig.pageTriggers = settings.pages.triggers;
         if (settings.pages.order) {
           state.uiConfig.layoutOrder = settings.pages.order;
diff --git a/src/altinn-app-frontend/src/features/instantiate/containers/index.test.tsx b/src/altinn-app-frontend/src/features/instantiate/containers/index.test.tsx
index 665db88735..2ae89015d6 100644
--- a/src/altinn-app-frontend/src/features/instantiate/containers/index.test.tsx
+++ b/src/altinn-app-frontend/src/features/instantiate/containers/index.test.tsx
@@ -60,6 +60,7 @@ describe('features/instantiate/index', () => {
             starting: 'instantiate.starting',
           },
         },
+        selectedAppLanguage: '',
         error: null,
       },
     });
diff --git a/src/altinn-app-frontend/src/selectors/appLanguageStateSelector.test.ts b/src/altinn-app-frontend/src/selectors/appLanguageStateSelector.test.ts
new file mode 100644
index 0000000000..3229519ed2
--- /dev/null
+++ b/src/altinn-app-frontend/src/selectors/appLanguageStateSelector.test.ts
@@ -0,0 +1,52 @@
+import { getProfileStateMock } from '../../__mocks__/profileStateMock';
+import { appLanguageStateSelector } from 'src/selectors/appLanguageStateSelector';
+import { statelessAndAllowAnonymousMock } from '../../__mocks__/statelessAndAllowAnonymousMock';
+
+describe('appLanguageStateSelector', () => {
+  interface ISetupProps {
+    allowAnonymous: boolean,
+    profileLanguage: string,
+    selectedLanguage: string
+  }
+
+  const setupState = ({ allowAnonymous, profileLanguage, selectedLanguage }: ISetupProps) => {
+    const mockInitialState = statelessAndAllowAnonymousMock(allowAnonymous)
+    const mockProfile = getProfileStateMock();
+    return {
+      ...mockInitialState,
+      profile: {
+        ...mockProfile,
+        profile: {
+          ...mockProfile.profile,
+          profileSettingPreference: { ...mockProfile.profile.profileSettingPreference, language: profileLanguage },
+        },
+      },
+      language: {
+        language: {},
+        error: null,
+        selectedAppLanguage: selectedLanguage,
+      },
+    }
+  };
+
+  it('should select profile language when allowAnonymous false and selected language not set', () => {
+    const state = setupState({ allowAnonymous: false, profileLanguage: 'nn', selectedLanguage: '' });
+    const appLanguage = appLanguageStateSelector(state);
+    expect(appLanguage).toBe('nn');
+  });
+  it('should select default when allowAnonymous true and selected language not set', () => {
+    const state = setupState({ allowAnonymous: true, profileLanguage: 'nn', selectedLanguage: '' });
+    const appLanguage = appLanguageStateSelector(state);
+    expect(appLanguage).toBe('nb');
+  });
+  it('should select selected app language when allowAnonymous true and selected language is set', () => {
+    const state = setupState({ allowAnonymous: true, profileLanguage: 'nn', selectedLanguage: 'en' });
+    const appLanguage = appLanguageStateSelector(state);
+    expect(appLanguage).toBe('en');
+  });
+  it('should select selected app language when allowAnonymous false and selected language is set', () => {
+    const state = setupState({ allowAnonymous: false, profileLanguage: 'nn', selectedLanguage: 'en' });
+    const appLanguage = appLanguageStateSelector(state);
+    expect(appLanguage).toBe('en');
+  });
+});
diff --git a/src/altinn-app-frontend/src/selectors/appLanguageStateSelector.ts b/src/altinn-app-frontend/src/selectors/appLanguageStateSelector.ts
new file mode 100644
index 0000000000..e2f15104b0
--- /dev/null
+++ b/src/altinn-app-frontend/src/selectors/appLanguageStateSelector.ts
@@ -0,0 +1,20 @@
+import { makeGetAllowAnonymousSelector } from 'src/selectors/getAllowAnonymous';
+import { IRuntimeState } from 'src/types';
+import { IProfile } from 'altinn-shared/types';
+import { profileStateSelector } from 'src/selectors/simpleSelectors';
+
+const allowAnonymousSelector = makeGetAllowAnonymousSelector();
+const selectedAppLanguageStateSelector = (state: IRuntimeState) =>
+  state.language.selectedAppLanguage;
+
+export const appLanguageStateSelector = (state: IRuntimeState) => {
+  let selectedAppLanguage = selectedAppLanguageStateSelector(state);
+  const allowAnonymous = allowAnonymousSelector(state);
+  if (!allowAnonymous) {
+    // Fallback to profile language if not anonymous
+    const profile: IProfile = profileStateSelector(state);
+    selectedAppLanguage = selectedAppLanguage || profile.profileSettingPreference.language;
+  }
+  // Fallback to nb if nothing is set
+  return selectedAppLanguage || 'nb';
+};
diff --git a/src/altinn-app-frontend/src/selectors/getAllowAnonymous.test.ts b/src/altinn-app-frontend/src/selectors/getAllowAnonymous.test.ts
index febae342d5..d763a7a222 100644
--- a/src/altinn-app-frontend/src/selectors/getAllowAnonymous.test.ts
+++ b/src/altinn-app-frontend/src/selectors/getAllowAnonymous.test.ts
@@ -1,99 +1,27 @@
-import type { IApplicationMetadata } from 'src/shared/resources/applicationMetadata';
 import type { IRuntimeState } from 'src/types';
 import { getInitialStateMock } from '../../__mocks__/initialStateMock';
 
 import { makeGetAllowAnonymousSelector } from './getAllowAnonymous';
+import { statelessAndAllowAnonymousMock } from '../../__mocks__/statelessAndAllowAnonymousMock';
 
 describe('selectors > getAllowAnonymous', () => {
   const initialState = getInitialStateMock();
   it('should return true if stateless && allowAnonymous is set to true on dataType', () => {
-    const initialAppMetadata: IApplicationMetadata = {
-      ...initialState.applicationMetadata.applicationMetadata,
-      onEntry: {
-        show: 'stateless',
-      },
-    };
-    initialAppMetadata.dataTypes[0].appLogic.allowAnonymousOnStateless = true;
-    const mockInitialState: IRuntimeState = {
-      ...initialState,
-      applicationMetadata: {
-        applicationMetadata: initialAppMetadata,
-        error: null,
-      },
-      formLayout: {
-        ...initialState.formLayout,
-        layoutsets: {
-          sets: [
-            {
-              id: 'stateless',
-              dataType: 'test-data-model',
-            },
-          ],
-        }
-      }
-    };
+    const mockInitialState = statelessAndAllowAnonymousMock(true)
     const getAllowAnonymous = makeGetAllowAnonymousSelector();
     const result = getAllowAnonymous(mockInitialState);
     expect(result).toBe(true);
   });
 
   it('should return false if stateless && allowAnonymous is set to false on dataType', () => {
-    const initialAppMetadata: IApplicationMetadata = {
-      ...initialState.applicationMetadata.applicationMetadata,
-      onEntry: {
-        show: 'stateless',
-      },
-    };
-    initialAppMetadata.dataTypes[0].appLogic.allowAnonymousOnStateless = false;
-    const mockInitialState: IRuntimeState = {
-      ...initialState,
-      applicationMetadata: {
-        applicationMetadata: initialAppMetadata,
-        error: null,
-      },
-      formLayout: {
-        ...initialState.formLayout,
-        layoutsets: {
-          sets: [
-            {
-              id: 'stateless',
-              dataType: 'test-data-model',
-            },
-          ],
-        }
-      }
-    };
+    const mockInitialState = statelessAndAllowAnonymousMock(false)
     const getAllowAnonymous = makeGetAllowAnonymousSelector();
     const result = getAllowAnonymous(mockInitialState);
     expect(result).toBe(false);
   });
 
   it('should return false if stateless && allowAnonymous is not set on dataType', () => {
-    const initialAppMetadata: IApplicationMetadata = {
-      ...initialState.applicationMetadata.applicationMetadata,
-      onEntry: {
-        show: 'stateless',
-      },
-    };
-
-    const mockInitialState: IRuntimeState = {
-      ...initialState,
-      applicationMetadata: {
-        applicationMetadata: initialAppMetadata,
-        error: null,
-      },
-      formLayout: {
-        ...initialState.formLayout,
-        layoutsets: {
-          sets: [
-            {
-              id: 'stateless',
-              dataType: 'test-data-model',
-            },
-          ],
-        }
-      }
-    };
+    const mockInitialState = statelessAndAllowAnonymousMock(undefined)
     const getAllowAnonymous = makeGetAllowAnonymousSelector();
     const result = getAllowAnonymous(mockInitialState);
     expect(result).toBe(false);
diff --git a/src/altinn-app-frontend/src/selectors/simpleSelectors.ts b/src/altinn-app-frontend/src/selectors/simpleSelectors.ts
index f0fb8b2436..86c8fc2e3b 100644
--- a/src/altinn-app-frontend/src/selectors/simpleSelectors.ts
+++ b/src/altinn-app-frontend/src/selectors/simpleSelectors.ts
@@ -1,9 +1,13 @@
 import type { IRuntimeState } from 'src/types';
 
-
-export const appMetaDataSelector = (state: IRuntimeState) => state.applicationMetadata.applicationMetadata;
-export const instanceDataSelector = (state: IRuntimeState) => state.instanceData.instance;
+export const appMetaDataSelector = (state: IRuntimeState) =>
+  state.applicationMetadata.applicationMetadata;
+export const instanceDataSelector = (state: IRuntimeState) =>
+  state.instanceData.instance;
 export const processStateSelector = (state: IRuntimeState) => state.process;
-export const currentSelectedPartyIdSelector = (state: IRuntimeState) => state.party.selectedParty?.partyId;
-export const layoutSetsSelector = (state: IRuntimeState) => state.formLayout.layoutsets;
-export const profileStateSelector = (state: IRuntimeState) => state.profile.profile;
+export const currentSelectedPartyIdSelector = (state: IRuntimeState) =>
+  state.party.selectedParty?.partyId;
+export const layoutSetsSelector = (state: IRuntimeState) =>
+  state.formLayout.layoutsets;
+export const profileStateSelector = (state: IRuntimeState) =>
+  state.profile.profile;
diff --git a/src/altinn-app-frontend/src/services/AppApi.tsx b/src/altinn-app-frontend/src/services/AppApi.tsx
index 3c3fc36158..73297eef09 100644
--- a/src/altinn-app-frontend/src/services/AppApi.tsx
+++ b/src/altinn-app-frontend/src/services/AppApi.tsx
@@ -35,6 +35,7 @@ const axiosBaseQuery =
 
 export enum TagTypes {
   Instances = 'Instances',
+  AppLanguage = 'AppLanguage'
 }
 
 export const appApi = createApi({
diff --git a/src/altinn-app-frontend/src/services/LanguageApi.tsx b/src/altinn-app-frontend/src/services/LanguageApi.tsx
new file mode 100644
index 0000000000..ce4577335e
--- /dev/null
+++ b/src/altinn-app-frontend/src/services/LanguageApi.tsx
@@ -0,0 +1,15 @@
+import { appApi } from 'src/services/AppApi';
+import { IAppLanguage } from 'altinn-shared/types';
+
+export const languageApi = appApi.injectEndpoints({
+  endpoints: (builder) => ({
+    getAppLanguage: builder.query<IAppLanguage[], void>({
+      query: () => ({
+        url: '/api/v1/applicationlanguages',
+        method: 'GET'
+      }),
+    })
+  }),
+});
+
+export const { useGetAppLanguageQuery } = languageApi;
diff --git a/src/altinn-app-frontend/src/shared/containers/Presentation.test.tsx b/src/altinn-app-frontend/src/shared/containers/Presentation.test.tsx
index 379250c291..7d133122c5 100644
--- a/src/altinn-app-frontend/src/shared/containers/Presentation.test.tsx
+++ b/src/altinn-app-frontend/src/shared/containers/Presentation.test.tsx
@@ -203,6 +203,7 @@ describe('containers/Presentation.tsx', () => {
             placeholder_user: 'OLA PRIVATPERSON',
           },
         },
+        selectedAppLanguage: "",
         error: null,
       },
       formValidations: {
diff --git a/src/altinn-app-frontend/src/shared/containers/Presentation.tsx b/src/altinn-app-frontend/src/shared/containers/Presentation.tsx
index 3100299bd2..ed7b4d2d34 100644
--- a/src/altinn-app-frontend/src/shared/containers/Presentation.tsx
+++ b/src/altinn-app-frontend/src/shared/containers/Presentation.tsx
@@ -7,12 +7,9 @@ import { AltinnAppTheme } from 'altinn-shared/theme';
 import {
   returnUrlToMessagebox,
   getTextResourceByKey,
-  returnUrlFromQueryParameter
+  returnUrlFromQueryParameter,
 } from 'altinn-shared/utils';
-import {
-  ProcessTaskType,
-  PresentationType,
-} from 'src/types';
+import { ProcessTaskType, PresentationType } from 'src/types';
 import { getNextView } from 'src/utils/formLayout';
 import { FormLayoutActions } from 'src/features/form/layout/formLayoutSlice';
 import { get } from 'src/utils/networking';
@@ -37,7 +34,6 @@ const PresentationComponent = (props: IPresentationProvidedProps) => {
   const dispatch = useAppDispatch();
   const party = useAppSelector(state => state.party?.selectedParty);
   const language = useAppSelector(state => state.language.language || {});
-  const hideCloseButton = useAppSelector(state => state.formLayout.uiConfig.hideCloseButton);
   const instance = useAppSelector(state => state.instanceData?.instance);
   const userParty = useAppSelector(state => state.profile.profile?.party);
   const textResources = useAppSelector(state => state.textResources.resources);
@@ -51,7 +47,9 @@ const PresentationComponent = (props: IPresentationProvidedProps) => {
       true,
     ),
   );
-  const returnToView = useAppSelector(state => state.formLayout.uiConfig.returnToView);
+  const returnToView = useAppSelector(
+    (state) => state.formLayout.uiConfig.returnToView,
+  );
 
   const handleBackArrowButton = () => {
     if (returnToView) {
@@ -73,7 +71,10 @@ const PresentationComponent = (props: IPresentationProvidedProps) => {
 
   const handleModalCloseButton = () => {
     const queryParameterReturnUrl = returnUrlFromQueryParameter();
-    const messageBoxUrl = returnUrlToMessagebox(window.location.origin, party?.partyId);
+    const messageBoxUrl = returnUrlToMessagebox(
+      window.location.origin,
+      party?.partyId,
+    );
     if (!queryParameterReturnUrl) {
       window.location.href = messageBoxUrl;
       return;
@@ -123,13 +124,11 @@ const PresentationComponent = (props: IPresentationProvidedProps) => {
             <NavBar
               handleClose={handleModalCloseButton}
               handleBack={handleBackArrowButton}
-              language={language}
               showBackArrow={
                 !!previousFormPage &&
                 (props.type === ProcessTaskType.Data ||
                   props.type === PresentationType.Stateless)
               }
-              hideCloseButton={hideCloseButton}
             />
             <div className='a-modal-content-target'>
               <div className='a-page a-current-page'>
diff --git a/src/altinn-app-frontend/src/shared/containers/__snapshots__/Presentation.test.tsx.snap b/src/altinn-app-frontend/src/shared/containers/__snapshots__/Presentation.test.tsx.snap
index e2131593de..9838bf37d0 100644
--- a/src/altinn-app-frontend/src/shared/containers/__snapshots__/Presentation.test.tsx.snap
+++ b/src/altinn-app-frontend/src/shared/containers/__snapshots__/Presentation.test.tsx.snap
@@ -207,28 +207,33 @@ exports[`containers/Presentation.tsx should match snapshot 1`] = `
         </div>
         <nav
           aria-label="Appnavigasjon"
-          className="a-modal-navbar"
+          className="MuiBox-root MuiBox-root-11 mt-3"
         >
-          <button
-            aria-label="Lukk skjema"
-            className="a-modal-close a-js-tabable-popover"
-            onClick={[Function]}
-            type="button"
+          <div />
+          <div
+            className="MuiBox-root MuiBox-root-12"
           >
-            <span
-              className="ai-stack"
-            >
-              <i
-                aria-hidden="true"
-                className="ai-stack-1x ai ai-exit  a-modal-close-icon"
-              />
-            </span>
-            <span
-              className="hidden-button-text"
+            <button
+              aria-label="Lukk skjema"
+              className="a-modal-close a-js-tabable-popover ml-1"
+              onClick={[Function]}
+              type="button"
             >
-              Lukk skjema
-            </span>
-          </button>
+              <span
+                className="ai-stack"
+              >
+                <i
+                  aria-hidden="true"
+                  className="ai-stack-1x ai ai-exit  a-modal-close-icon"
+                />
+              </span>
+              <span
+                className="sr-only"
+              >
+                Lukk skjema
+              </span>
+            </button>
+          </div>
         </nav>
         <div
           className="a-modal-content-target"
diff --git a/src/altinn-app-frontend/src/shared/resources/language/fetch/fetchLanguageSagas.test.ts b/src/altinn-app-frontend/src/shared/resources/language/fetch/fetchLanguageSagas.test.ts
index 004ff16650..b36f9fbd0a 100644
--- a/src/altinn-app-frontend/src/shared/resources/language/fetch/fetchLanguageSagas.test.ts
+++ b/src/altinn-app-frontend/src/shared/resources/language/fetch/fetchLanguageSagas.test.ts
@@ -1,17 +1,16 @@
-import { call, take, all, select } from 'redux-saga/effects';
+import { call, take, all, select, takeLatest } from 'redux-saga/effects';
 import { expectSaga } from 'redux-saga-test-plan';
 
 import {
+  allowAnonymousSelector,
   fetchLanguageSaga,
   watchFetchLanguageSaga,
-  allowAnonymousSelector,
 } from './fetchLanguageSagas';
-import { profileStateSelector } from 'src/selectors/simpleSelectors';
 import { LanguageActions } from '../languageSlice';
 import { FormLayoutActions } from 'src/features/form/layout/formLayoutSlice';
 import { getLanguageFromCode } from 'altinn-shared/language';
-import type { IProfile } from 'altinn-shared/types';
 import * as language from 'altinn-shared/language';
+import { appLanguageStateSelector } from 'src/selectors/appLanguageStateSelector';
 
 describe('languageActions', () => {
   it('should create an action with correct type: FETCH_LANGUAGE', () => {
@@ -56,43 +55,24 @@ describe('fetchLanguageSagas', () => {
     expect(generator.next().value).toEqual(select(allowAnonymousSelector));
     expect(generator.next().value).toEqual(take('PROFILE.FETCH_PROFILE_FULFILLED'));
     expect(generator.next().value).toEqual(call(fetchLanguageSaga));
+    expect(generator.next().value).toEqual(takeLatest(LanguageActions.updateSelectedAppLanguage,fetchLanguageSaga));
     expect(generator.next().done).toBeTruthy();
   });
 
-  it('should fetch default language when allowAnonymous is true', () => {
-
-    return expectSaga(fetchLanguageSaga)
-      .provide([
-        [select(allowAnonymousSelector), true],
-      ])
-      .put(LanguageActions.fetchLanguageFulfilled({ language: getLanguageFromCode('nb') }))
-      .run();
-  });
-
   it('should fetch default language when defaultLanguage is true', () => {
 
     return expectSaga(fetchLanguageSaga, true)
+      .provide([
+        [select(appLanguageStateSelector), "en"],
+      ])
       .put(LanguageActions.fetchLanguageFulfilled({ language: getLanguageFromCode('nb') }))
       .run();
   });
 
-  it('should fetch language from profile settings when allowAnonymous is false', () => {
-    const profileMock: IProfile = {
-      userId: 1,
-      userName: '',
-      partyId: 1234,
-      party: null,
-      userType: 1,
-      profileSettingPreference: {
-        doNotPromptForParty: false,
-        language: 'en',
-        preSelectedPartyId: 0,
-      }
-    };
+  it('should fetch language from app language state', () => {
     return expectSaga(fetchLanguageSaga)
       .provide([
-        [select(allowAnonymousSelector), false],
-        [select(profileStateSelector), profileMock]
+        [select(appLanguageStateSelector), "en"]
       ])
       .put(LanguageActions.fetchLanguageFulfilled({ language: getLanguageFromCode('en') }))
       .run();
diff --git a/src/altinn-app-frontend/src/shared/resources/language/fetch/fetchLanguageSagas.ts b/src/altinn-app-frontend/src/shared/resources/language/fetch/fetchLanguageSagas.ts
index 6a0ca5b9cd..69b17a3378 100644
--- a/src/altinn-app-frontend/src/shared/resources/language/fetch/fetchLanguageSagas.ts
+++ b/src/altinn-app-frontend/src/shared/resources/language/fetch/fetchLanguageSagas.ts
@@ -1,30 +1,20 @@
 import { SagaIterator } from 'redux-saga';
-import { call, put, all, take, select } from 'redux-saga/effects';
-
-import type { IProfile } from 'altinn-shared/types';
+import { call, put, all, take, select, takeLatest } from 'redux-saga/effects';
 
 import { getLanguageFromCode } from 'altinn-shared/language';
 import { LanguageActions } from '../languageSlice';
 import * as ProfileActionTypes from '../../profile/fetch/fetchProfileActionTypes';
 import { appTaskQueueError } from '../../queue/queueSlice';
-import { makeGetAllowAnonymousSelector } from 'src/selectors/getAllowAnonymous';
 import { FormLayoutActions } from 'src/features/form/layout/formLayoutSlice';
 import { FETCH_APPLICATION_METADATA_FULFILLED } from '../../applicationMetadata/actions/types';
-import { profileStateSelector } from 'src/selectors/simpleSelectors';
+import { appLanguageStateSelector } from 'src/selectors/appLanguageStateSelector';
+import { makeGetAllowAnonymousSelector } from 'src/selectors/getAllowAnonymous';
 
 export const allowAnonymousSelector = makeGetAllowAnonymousSelector();
 
 export function* fetchLanguageSaga(defaultLanguage = false): SagaIterator {
   try {
-    let languageCode = 'nb';
-    if (!defaultLanguage) {
-      const allowAnonymous = yield select(allowAnonymousSelector);
-      if (!allowAnonymous) {
-        const profile: IProfile = yield select(profileStateSelector);
-        languageCode = profile.profileSettingPreference.language;
-      }
-    }
-
+    const languageCode = defaultLanguage === true ? "nb": yield select(appLanguageStateSelector);
     const language = getLanguageFromCode(languageCode);
     yield put(LanguageActions.fetchLanguageFulfilled({ language }));
   } catch (error) {
@@ -46,6 +36,7 @@ export function* watchFetchLanguageSaga(): SagaIterator {
   }
 
   yield call(fetchLanguageSaga);
+  yield takeLatest(LanguageActions.updateSelectedAppLanguage,fetchLanguageSaga)
 }
 
 export function* watchFetchDefaultLanguageSaga(): SagaIterator {
diff --git a/src/altinn-app-frontend/src/shared/resources/language/languageSlice.ts b/src/altinn-app-frontend/src/shared/resources/language/languageSlice.ts
index 3fb8794e44..fc76010698 100644
--- a/src/altinn-app-frontend/src/shared/resources/language/languageSlice.ts
+++ b/src/altinn-app-frontend/src/shared/resources/language/languageSlice.ts
@@ -1,5 +1,6 @@
 import { createAction, createSlice, PayloadAction } from '@reduxjs/toolkit';
 import type { ILanguage } from 'altinn-shared/types';
+import { IAltinnWindow } from 'src/types';
 
 export interface IFetchLanguageFulfilled {
   language: ILanguage;
@@ -7,14 +8,23 @@ export interface IFetchLanguageFulfilled {
 export interface IFetchLanguageRejected {
   error: Error;
 }
+export interface IUpdateSelectedAppLanguage {
+  selected: string;
+}
 
 export interface ILanguageState {
   language: ILanguage;
+  selectedAppLanguage: string;
   error: Error;
 }
 
+const altinnWindow = window as Window as IAltinnWindow;
+const { app } = altinnWindow;
+const localStorageSlectedAppLanguageKey = `selectedAppLanguage${app}`;
+
 export const initialState: ILanguageState = {
   language: null,
+  selectedAppLanguage: localStorage.getItem(localStorageSlectedAppLanguageKey) || '',
   error: null,
 };
 
@@ -30,6 +40,11 @@ const languageSlice = createSlice({
     fetchLanguageRejected: (state, action: PayloadAction<IFetchLanguageRejected>) => {
       const { error } = action.payload;
       state.error = error;
+    },
+    updateSelectedAppLanguage: (state, action: PayloadAction<IUpdateSelectedAppLanguage>)=>{
+      const { selected } = action.payload;
+      localStorage.setItem(localStorageSlectedAppLanguageKey, selected);
+      state.selectedAppLanguage = selected;
     }
   }
 });
diff --git a/src/altinn-app-frontend/src/shared/resources/options/fetch/fetchOptionsSagas.test.ts b/src/altinn-app-frontend/src/shared/resources/options/fetch/fetchOptionsSagas.test.ts
index fb86ad72dd..21949d9085 100644
--- a/src/altinn-app-frontend/src/shared/resources/options/fetch/fetchOptionsSagas.test.ts
+++ b/src/altinn-app-frontend/src/shared/resources/options/fetch/fetchOptionsSagas.test.ts
@@ -1,11 +1,21 @@
 import { expectSaga, testSaga } from 'redux-saga-test-plan';
 import { select } from 'redux-saga/effects';
 import FormDataActions from 'src/features/form/data/formDataActions';
-import { checkIfOptionsShouldRefetchSaga, fetchOptionsSaga, fetchSpecificOptionSaga, formDataSelector, formLayoutSelector, instanceIdSelector, optionsSelector, userLanguageSelector, watchCheckIfOptionsShouldRefetchSaga } from 'src/shared/resources/options/fetch/fetchOptionsSagas';
+import {
+  checkIfOptionsShouldRefetchSaga,
+  fetchOptionsSaga,
+  fetchSpecificOptionSaga,
+  formDataSelector,
+  formLayoutSelector,
+  instanceIdSelector,
+  optionsSelector,
+  watchCheckIfOptionsShouldRefetchSaga,
+} from 'src/shared/resources/options/fetch/fetchOptionsSagas';
 import type { IOptions, IRuntimeState } from 'src/types';
 import * as networking from 'altinn-shared/utils/networking';
 import type { IInstance } from 'altinn-shared/types';
 import type { ILayouts, ISelectionComponentProps } from 'src/features/form/layout';
+import { appLanguageStateSelector } from 'src/selectors/appLanguageStateSelector';
 
 
 describe('shared > resources > options > fetch > fetchOptionsSagas', () => {
@@ -15,7 +25,7 @@ describe('shared > resources > options > fetch > fetchOptionsSagas', () => {
         .next()
         .takeEvery([
           FormDataActions.updateFormDataFulfilled,
-          FormDataActions.updateFormDataSkipAutosave
+          FormDataActions.updateFormDataSkipAutosave,
         ], checkIfOptionsShouldRefetchSaga)
         .next()
         .isDone();
@@ -27,11 +37,11 @@ describe('shared > resources > options > fetch > fetchOptionsSagas', () => {
     const action = {
       payload: {
         field: 'some_field',
-        data: ''
-      }, type: ''
+        data: '',
+      }, type: '',
     };
     const formData = {
-      someField: 'someValue'
+      someField: 'someValue',
     };
 
 
@@ -42,23 +52,23 @@ describe('shared > resources > options > fetch > fetchOptionsSagas', () => {
           id: 'someOption',
           options: [],
           mapping: {
-            some_field: 'some_url_parm'
-          }
-        }
+            some_field: 'some_url_parm',
+          },
+        },
       };
       return expectSaga(checkIfOptionsShouldRefetchSaga, action)
         .provide([
           [select(formDataSelector), formData],
-          [select(userLanguageSelector), userLanguage],
+          [select(appLanguageStateSelector), userLanguage],
           [select(optionsSelector), optionsWithField],
-          [select(instanceIdSelector), 'someId']
+          [select(instanceIdSelector), 'someId'],
         ])
         .fork(fetchSpecificOptionSaga, {
           optionsId: 'someOption',
           dataMapping: {
-            some_field: 'some_url_parm'
+            some_field: 'some_url_parm',
           },
-          secure: undefined
+          secure: undefined,
         })
         .run();
     });
@@ -69,14 +79,14 @@ describe('shared > resources > options > fetch > fetchOptionsSagas', () => {
           id: 'someOption',
           options: [],
           mapping: {
-            some_other_field: 'some_url_parm'
-          }
-        }
+            some_other_field: 'some_url_parm',
+          },
+        },
       };
       return expectSaga(checkIfOptionsShouldRefetchSaga, action)
         .provide([
           [select(formDataSelector), formData],
-          [select(userLanguageSelector), userLanguage],
+          [select(appLanguageStateSelector), userLanguage],
           [select(optionsSelector), optionsWithoutField],
         ])
         .run();
@@ -92,48 +102,48 @@ describe('shared > resources > options > fetch > fetchOptionsSagas', () => {
             id: 'fylke',
             type: 'Dropdown',
             textResourceBindings: {
-              'title': 'fylke'
+              'title': 'fylke',
             },
             dataModelBindings: {
-              simpleBinding: 'FlytteFra.Fylke'
+              simpleBinding: 'FlytteFra.Fylke',
             },
             optionsId: 'fylke',
-            required: true
+            required: true,
           } as ISelectionComponentProps,
           {
             id: 'fylke-2',
             type: 'Dropdown',
             textResourceBindings: {
-              title: 'fylke'
+              title: 'fylke',
             },
             dataModelBindings: {
-              simpleBinding: 'FlytteFra.Fylke'
+              simpleBinding: 'FlytteFra.Fylke',
             },
             optionsId: 'fylke',
-            required: true
+            required: true,
           } as ISelectionComponentProps,
           {
             id: 'kommune',
             type: 'Dropdown',
             textResourceBindings: {
-              title: 'kommune'
+              title: 'kommune',
             },
             dataModelBindings: {
-              simpleBinding: 'FlytteFra.Kommune'
+              simpleBinding: 'FlytteFra.Kommune',
             },
             optionsId: 'kommune',
             required: true,
             mapping: {
-              'FlytteFra.Fylke': 'fylke'
-            }
+              'FlytteFra.Fylke': 'fylke',
+            },
           } as ISelectionComponentProps,
-        ]
+        ],
       };
 
       return expectSaga(fetchOptionsSaga)
         .provide([
           [select(formLayoutSelector), formLayoutWithTwoSharedOptionIds],
-          [select(instanceIdSelector), 'someId']
+          [select(instanceIdSelector), 'someId'],
         ])
         .fork(fetchSpecificOptionSaga, {
           optionsId: 'fylke',
@@ -144,7 +154,7 @@ describe('shared > resources > options > fetch > fetchOptionsSagas', () => {
         .fork(fetchSpecificOptionSaga, {
           optionsId: 'kommune',
           dataMapping: {
-            'FlytteFra.Fylke': 'fylke'
+            'FlytteFra.Fylke': 'fylke',
           },
           secure: undefined,
         })
@@ -160,51 +170,51 @@ describe('shared > resources > options > fetch > fetchOptionsSagas', () => {
             id: 'kommune-1',
             type: 'Dropdown',
             textResourceBindings: {
-              title: 'kommune'
+              title: 'kommune',
             },
             dataModelBindings: {
-              simpleBinding: 'FlytteFra.Kommune'
+              simpleBinding: 'FlytteFra.Kommune',
             },
             optionsId: 'kommune',
             required: true,
             mapping: {
-              'FlytteFra.Fylke': 'fylke'
-            }
+              'FlytteFra.Fylke': 'fylke',
+            },
           } as ISelectionComponentProps,
           {
             id: 'kommune-2',
             type: 'Dropdown',
             textResourceBindings: {
-              title: 'kommune'
+              title: 'kommune',
             },
             dataModelBindings: {
-              simpleBinding: 'FlytteTil.Kommune'
+              simpleBinding: 'FlytteTil.Kommune',
             },
             optionsId: 'kommune',
             required: true,
             mapping: {
-              'FlytteTil.Fylke': 'fylke'
-            }
+              'FlytteTil.Fylke': 'fylke',
+            },
           } as ISelectionComponentProps,
-        ]
+        ],
       };
 
       return expectSaga(fetchOptionsSaga)
         .provide([
           [select(formLayoutSelector), formLayoutWithSameOptionIdButDifferentMapping],
-          [select(instanceIdSelector), 'someId']
+          [select(instanceIdSelector), 'someId'],
         ])
         .fork(fetchSpecificOptionSaga, {
           optionsId: 'kommune',
           dataMapping: {
-            'FlytteFra.Fylke': 'fylke'
+            'FlytteFra.Fylke': 'fylke',
           },
           secure: undefined,
         })
         .fork(fetchSpecificOptionSaga, {
           optionsId: 'kommune',
           dataMapping: {
-            'FlytteTil.Fylke': 'fylke'
+            'FlytteTil.Fylke': 'fylke',
           },
           secure: undefined,
         })
diff --git a/src/altinn-app-frontend/src/shared/resources/options/fetch/fetchOptionsSagas.ts b/src/altinn-app-frontend/src/shared/resources/options/fetch/fetchOptionsSagas.ts
index d8f142a82f..1828f82c86 100644
--- a/src/altinn-app-frontend/src/shared/resources/options/fetch/fetchOptionsSagas.ts
+++ b/src/altinn-app-frontend/src/shared/resources/options/fetch/fetchOptionsSagas.ts
@@ -12,12 +12,12 @@ import { IUpdateFormDataFulfilled } from 'src/features/form/data/formDataTypes';
 import { PayloadAction } from '@reduxjs/toolkit';
 import { IFormData } from 'src/features/form/data/formDataReducer';
 import { getOptionLookupKey } from 'src/utils/options';
+import { appLanguageStateSelector } from 'src/selectors/appLanguageStateSelector';
+import { LanguageActions } from 'src/shared/resources/language/languageSlice';
 
 export const formLayoutSelector = (state: IRuntimeState): ILayouts =>
   state.formLayout.layouts;
 export const formDataSelector = (state: IRuntimeState) => state.formData.formData;
-export const userLanguageSelector = (state: IRuntimeState) =>
-  state.profile.profile.profileSettingPreference.language;
 export const optionsSelector = (state: IRuntimeState): IOptions => state.optionState.options;
 export const instanceIdSelector = (state: IRuntimeState): string => state.instanceData.instance?.id;
 
@@ -58,7 +58,7 @@ export function* fetchSpecificOptionSaga({
     };
     yield call(OptionsActions.fetchingOptions, optionKey, optionMetaData);
     const formData: IFormData = yield select(formDataSelector);
-    const language: string = yield select(userLanguageSelector);
+    const language = yield select(appLanguageStateSelector);
     const url = getOptionsUrl({ optionsId, formData, language, dataMapping, secure, instanceId });
     const options: IOption[] = yield call(get, url);
     yield call(OptionsActions.fetchOptionsFulfilled, optionKey, options);
@@ -104,4 +104,5 @@ export function* watchInitialFetchOptionSaga(): SagaIterator {
 
 export function* watchFetchOptionsSaga(): SagaIterator {
   yield takeLatest(fetchOptionActionTypes.FETCH_OPTIONS, fetchOptionsSaga);
+  yield takeLatest(LanguageActions.updateSelectedAppLanguage, fetchOptionsSaga);
 }
diff --git a/src/altinn-app-frontend/src/shared/resources/textResources/fetch/fetchTextResourcesSagas.test.ts b/src/altinn-app-frontend/src/shared/resources/textResources/fetch/fetchTextResourcesSagas.test.ts
index 1819bcf42b..f953af08c2 100644
--- a/src/altinn-app-frontend/src/shared/resources/textResources/fetch/fetchTextResourcesSagas.test.ts
+++ b/src/altinn-app-frontend/src/shared/resources/textResources/fetch/fetchTextResourcesSagas.test.ts
@@ -1,18 +1,24 @@
-import { all, call, select, take } from 'redux-saga/effects';
+import { all, call, select, take, takeLatest } from 'redux-saga/effects';
 import { expectSaga } from 'redux-saga-test-plan';
 
-import { watchFetchTextResourcesSaga,
+import {
+  watchFetchTextResourcesSaga,
   fetchTextResources,
-  allowAnonymousSelector } from './fetchTextResourcesSagas';
+  allowAnonymousSelector,
+} from './fetchTextResourcesSagas';
 import { FormLayoutActions } from 'src/features/form/layout/formLayoutSlice';
 import { FETCH_TEXT_RESOURCES } from './fetchTextResourcesActionTypes';
 import { FETCH_APPLICATION_METADATA_FULFILLED } from 'src/shared/resources/applicationMetadata/actions/types';
 import { FETCH_PROFILE_FULFILLED } from '../../profile/fetch/fetchProfileActionTypes';
-import { profileStateSelector } from 'src/selectors/simpleSelectors';
+import {
+  profileStateSelector,
+} from 'src/selectors/simpleSelectors';
 import { IProfile } from 'altinn-shared/types';
 import { get } from 'src/utils/networking';
 import { textResourcesUrl } from 'src/utils/appUrlHelper';
 import TextResourcesActions from '../textResourcesActions';
+import { appLanguageStateSelector } from 'src/selectors/appLanguageStateSelector';
+import { LanguageActions } from 'src/shared/resources/language/languageSlice';
 
 describe('fetchTextResourcesSagas', () => {
   it('should dispatch action fetchTextResources', () => {
@@ -21,12 +27,18 @@ describe('fetchTextResourcesSagas', () => {
       all([
         take(FormLayoutActions.fetchLayoutSetsFulfilled),
         take(FETCH_APPLICATION_METADATA_FULFILLED),
-        take(FETCH_TEXT_RESOURCES)
+        take(FETCH_TEXT_RESOURCES),
       ]),
     );
     expect(generator.next().value).toEqual(select(allowAnonymousSelector));
     expect(generator.next().value).toEqual(take(FETCH_PROFILE_FULFILLED));
     expect(generator.next().value).toEqual(call(fetchTextResources));
+    expect(generator.next().value).toEqual(
+      takeLatest(FETCH_TEXT_RESOURCES, fetchTextResources),
+    );
+    expect(generator.next().value).toEqual(
+      takeLatest(LanguageActions.updateSelectedAppLanguage, fetchTextResources),
+    );
     expect(generator.next().done).toBeTruthy();
   });
   it('should fetch text resources using default language when allowAnonymous is true', () => {
@@ -40,14 +52,42 @@ describe('fetchTextResourcesSagas', () => {
       ],
     };
     expectSaga(fetchTextResources)
-    .provide([
-      [select(allowAnonymousSelector), true],
-      [call(get, textResourcesUrl('nb')), mockTextResource],
-    ])
-    .call(TextResourcesActions.fetchTextResourcesFulfilled, 'nb', mockTextResource.resources)
-    .run();
-  })
-  it('should run fetch text resources using profile language', () => {
+      .provide([
+        [select(appLanguageStateSelector), ''],
+        [select(allowAnonymousSelector), true],
+        [call(get, textResourcesUrl('nb')), mockTextResource],
+      ])
+      .call(
+        TextResourcesActions.fetchTextResourcesFulfilled,
+        'nb',
+        mockTextResource.resources,
+      )
+      .run();
+  });
+  it('should run fetch text resources using app language', () => {
+
+    const mockTextResource = {
+      language: 'en',
+      resources: [
+        {
+          id: 'id1',
+          value: 'This is a text',
+        },
+      ],
+    };
+    return expectSaga(fetchTextResources)
+      .provide([
+        [select(appLanguageStateSelector), 'en'],
+        [call(get, textResourcesUrl('en')), mockTextResource],
+      ])
+      .call(
+        TextResourcesActions.fetchTextResourcesFulfilled,
+        'en',
+        mockTextResource.resources,
+      )
+      .run();
+  });
+  it('should run fetch text resources using app language', () => {
     const profileMock: IProfile = {
       userId: 1,
       userName: '',
@@ -56,9 +96,9 @@ describe('fetchTextResourcesSagas', () => {
       userType: 1,
       profileSettingPreference: {
         doNotPromptForParty: false,
-        language: 'en',
+        language: 'nb',
         preSelectedPartyId: 0,
-      }
+      },
     };
     const mockTextResource = {
       language: 'en',
@@ -70,12 +110,17 @@ describe('fetchTextResourcesSagas', () => {
       ],
     };
     return expectSaga(fetchTextResources)
-    .provide([
-      [select(allowAnonymousSelector), false],
-      [select(profileStateSelector), profileMock],
-      [call(get, textResourcesUrl('en')), mockTextResource]
-    ])
-    .call(TextResourcesActions.fetchTextResourcesFulfilled, 'en', mockTextResource.resources)
-    .run();
-  })
-})
+      .provide([
+        [select(appLanguageStateSelector), 'en'],
+        [select(allowAnonymousSelector), false],
+        [select(profileStateSelector), profileMock],
+        [call(get, textResourcesUrl('en')), mockTextResource],
+      ])
+      .call(
+        TextResourcesActions.fetchTextResourcesFulfilled,
+        'en',
+        mockTextResource.resources,
+      )
+      .run();
+  });
+});
diff --git a/src/altinn-app-frontend/src/shared/resources/textResources/fetch/fetchTextResourcesSagas.ts b/src/altinn-app-frontend/src/shared/resources/textResources/fetch/fetchTextResourcesSagas.ts
index 32b857a060..1a11eed56b 100644
--- a/src/altinn-app-frontend/src/shared/resources/textResources/fetch/fetchTextResourcesSagas.ts
+++ b/src/altinn-app-frontend/src/shared/resources/textResources/fetch/fetchTextResourcesSagas.ts
@@ -1,8 +1,7 @@
 import { SagaIterator } from 'redux-saga';
-import { IProfile } from 'altinn-shared/types';
-import { all, call, put, select, take } from 'redux-saga/effects';
-import { get } from '../../../../utils/networking';
-import { textResourcesUrl, oldTextResourcesUrl } from '../../../../utils/appUrlHelper';
+import { all, call, put, select, take, takeLatest } from 'redux-saga/effects';
+import { get } from 'src/utils/networking';
+import { textResourcesUrl, oldTextResourcesUrl } from 'src/utils/appUrlHelper';
 import TextResourcesActions from '../textResourcesActions';
 import { appTaskQueueError } from '../../queue/queueSlice';
 import { FETCH_TEXT_RESOURCES } from './fetchTextResourcesActionTypes';
@@ -10,21 +9,17 @@ import { FETCH_PROFILE_FULFILLED } from '../../profile/fetch/fetchProfileActionT
 import { FETCH_APPLICATION_METADATA_FULFILLED } from 'src/shared/resources/applicationMetadata/actions/types';
 import { FormLayoutActions } from 'src/features/form/layout/formLayoutSlice';
 import { makeGetAllowAnonymousSelector } from 'src/selectors/getAllowAnonymous';
-import { profileStateSelector } from 'src/selectors/simpleSelectors';
+import { appLanguageStateSelector } from 'src/selectors/appLanguageStateSelector';
+import { LanguageActions } from 'src/shared/resources/language/languageSlice';
 
 export const allowAnonymousSelector = makeGetAllowAnonymousSelector();
+
 export function* fetchTextResources(): SagaIterator {
   try {
-    let languageCode = 'nb'; // Use 'nb' as default until we decide how to handle default language
-    const allowAnonymous = yield select(allowAnonymousSelector);
-    if (!allowAnonymous) {
-      const profile: IProfile = yield select(profileStateSelector);
-      languageCode = profile.profileSettingPreference.language;
-    }
-
+    const appLanguage = yield select(appLanguageStateSelector);
     let resource: any;
     try {
-      resource = yield call(get, textResourcesUrl(languageCode));
+      resource = yield call(get, textResourcesUrl(appLanguage));
     } catch (error) {
       if (error.response.status !== 200) {
         resource = yield call(get, oldTextResourcesUrl);
@@ -36,7 +31,11 @@ export function* fetchTextResources(): SagaIterator {
         res.unparsedValue = res.value;
       }
     });
-    yield call(TextResourcesActions.fetchTextResourcesFulfilled, resource.language, resource.resources);
+    yield call(
+      TextResourcesActions.fetchTextResourcesFulfilled,
+      resource.language,
+      resource.resources,
+    );
   } catch (error) {
     yield call(TextResourcesActions.fetchTextResourcesRejected, error);
     yield put(appTaskQueueError({ error }));
@@ -47,7 +46,7 @@ export function* watchFetchTextResourcesSaga(): SagaIterator {
   yield all([
     take(FormLayoutActions.fetchLayoutSetsFulfilled),
     take(FETCH_APPLICATION_METADATA_FULFILLED),
-    take(FETCH_TEXT_RESOURCES)
+    take(FETCH_TEXT_RESOURCES),
   ]);
 
   const allowAnonymous = yield select(allowAnonymousSelector);
@@ -56,4 +55,6 @@ export function* watchFetchTextResourcesSaga(): SagaIterator {
     yield take(FETCH_PROFILE_FULFILLED);
   }
   yield call(fetchTextResources);
+  yield takeLatest(FETCH_TEXT_RESOURCES, fetchTextResources);
+  yield takeLatest(LanguageActions.updateSelectedAppLanguage, fetchTextResources);
 }
diff --git a/src/altinn-app-frontend/src/shared/resources/textResources/replace/replaceTextResourceSagas.test.ts b/src/altinn-app-frontend/src/shared/resources/textResources/replace/replaceTextResourceSagas.test.ts
index 7c1a57d28d..43ca406740 100644
--- a/src/altinn-app-frontend/src/shared/resources/textResources/replace/replaceTextResourceSagas.test.ts
+++ b/src/altinn-app-frontend/src/shared/resources/textResources/replace/replaceTextResourceSagas.test.ts
@@ -41,6 +41,11 @@ describe('watchReplaceTextResourcesSaga', () => {
         replaceTextResourcesSaga,
       )
       .next()
+      .takeLatest(
+        FETCH_TEXT_RESOURCES_FULFILLED,
+        replaceTextResourcesSaga,
+      )
+      .next()
       .isDone();
   });
 });
diff --git a/src/altinn-app-frontend/src/shared/resources/textResources/replace/replaceTextResourcesSagas.ts b/src/altinn-app-frontend/src/shared/resources/textResources/replace/replaceTextResourcesSagas.ts
index a0ca8148e2..ec92e9db13 100644
--- a/src/altinn-app-frontend/src/shared/resources/textResources/replace/replaceTextResourcesSagas.ts
+++ b/src/altinn-app-frontend/src/shared/resources/textResources/replace/replaceTextResourcesSagas.ts
@@ -93,6 +93,7 @@ export function* watchReplaceTextResourcesSaga(): SagaIterator {
     FormDataActions.setFormDataFulfilled,
     replaceTextResourcesSaga,
   );
+  yield takeLatest(FETCH_TEXT_RESOURCES_FULFILLED, replaceTextResourcesSaga);
 }
 
 export function* watchReplaceTextResourcesSagaDirect(): SagaIterator {
diff --git a/src/altinn-app-frontend/src/types/index.ts b/src/altinn-app-frontend/src/types/index.ts
index a5fc147e0d..edaadd6ac6 100644
--- a/src/altinn-app-frontend/src/types/index.ts
+++ b/src/altinn-app-frontend/src/types/index.ts
@@ -115,6 +115,7 @@ export interface IPagesSettings {
   order: string[];
   triggers?: Triggers[];
   hideCloseButton?: boolean;
+  showLanguageSelector?: boolean;
 }
 
 export interface ILayoutNavigation {
@@ -246,6 +247,7 @@ export interface IUiConfig {
   layoutOrder: string[];
   pageTriggers?: Triggers[];
   hideCloseButton?: boolean;
+  showLanguageSelector?: boolean;
 }
 
 export interface IValidationResult {
diff --git a/src/shared/src/components/Select.tsx b/src/shared/src/components/Select.tsx
new file mode 100644
index 0000000000..41d3543766
--- /dev/null
+++ b/src/shared/src/components/Select.tsx
@@ -0,0 +1,71 @@
+import { makeStyles } from '@material-ui/core/styles';
+import cn from 'classnames';
+import * as React from 'react';
+import { AltinnAppTheme } from '../theme';
+import '../../../altinn-app-frontend/src/styles/shared.css';
+
+const useStyles = makeStyles({
+  select: {
+    fontSize: '1.6rem',
+    '&:focus': {
+      outline: `2px solid ${AltinnAppTheme.altinnPalette.primary.blueDark}`,
+    },
+  },
+});
+
+const optionStyle = {
+  display: 'none',
+};
+interface ISelectProps {
+  id: string;
+  onChange: (event: React.ChangeEvent<HTMLSelectElement>) => void;
+  onBlur?: (event: React.FocusEvent<HTMLSelectElement>) => void;
+  options: { value: string; label: string }[];
+  value: string;
+  disabled?: boolean;
+  error?: boolean;
+  fullWidth?: boolean;
+  className?: string;
+}
+
+const Select = ({
+  id,
+  onChange,
+  onBlur,
+  options,
+  value,
+  disabled = false,
+  error = false,
+  fullWidth = false,
+  className,
+}: ISelectProps) => {
+  const classes = useStyles();
+  return (
+    <select
+      id={id}
+      value={value}
+      disabled={disabled}
+      className={cn(
+        classes.select,
+        'custom-select a-custom-select',
+        {
+          'validation-error': error,
+          'disabled !important': disabled,
+        },
+        className,
+      )}
+      style={{ width: fullWidth ? '100%' : 'unset' }}
+      onChange={onChange}
+      onBlur={onBlur}
+    >
+      <option style={optionStyle} />
+      {options.map((option, index) => (
+        <option key={index} value={option.value}>
+          {option.label}
+        </option>
+      ))}
+    </select>
+  );
+};
+
+export default Select;
diff --git a/src/shared/src/components/index.ts b/src/shared/src/components/index.ts
index 9b93b9615a..672b303ac7 100644
--- a/src/shared/src/components/index.ts
+++ b/src/shared/src/components/index.ts
@@ -11,6 +11,7 @@ export { default as AltinnLogo } from './AltinnLogo';
 export { default as AltinnPopover } from './AltinnPopover';
 export { default as AltinnSpinner } from './AltinnSpinner';
 export { default as AltinnLoader } from './AltinnLoader';
+export { default as Select } from './Select';
 
 // atoms
 export { default as AltinnAttachment } from './atoms/AltinnAttachment';
diff --git a/src/shared/src/language/texts/en.ts b/src/shared/src/language/texts/en.ts
index aa11c95bb4..d3e81f2f26 100644
--- a/src/shared/src/language/texts/en.ts
+++ b/src/shared/src/language/texts/en.ts
@@ -224,6 +224,16 @@ export function en() {
       required: 'Field is required',
       enum: 'Only the values {0} are permitted',
     },
+    language: {
+      full_name: {
+        nb: 'Norwegian bokmål',
+        en: "English",
+        nn: "Norwegian nynorsk"
+      },
+      selector: {
+        label: 'Language'
+      }
+    },
     soft_validation: {
       info_title: 'Information',
       warning_title: 'Note',
diff --git a/src/shared/src/language/texts/nb.ts b/src/shared/src/language/texts/nb.ts
index 33fec00e63..3cfa6359b5 100644
--- a/src/shared/src/language/texts/nb.ts
+++ b/src/shared/src/language/texts/nb.ts
@@ -157,6 +157,16 @@ export function nb() {
       authorization_error_instantiate_validation_info_customer_service: 'Om du står fast kontakt oss på brukerservice {0}.',
       starting: 'Hold deg fast, nå starter vi!',
     },
+    language: {
+      full_name: {
+        nb: 'Norsk bokmål',
+        en: "Engelsk",
+        nn: "Nynorsk"
+      },
+      selector: {
+        label: 'Språk'
+      }
+    },
     party_selection: {
       error_caption_prefix: 'Feil',
       invalid_selection_first_part: 'Du har startet tjenesten som',
diff --git a/src/shared/src/language/texts/nn.ts b/src/shared/src/language/texts/nn.ts
index 6cc79f046a..628d77ac34 100644
--- a/src/shared/src/language/texts/nn.ts
+++ b/src/shared/src/language/texts/nn.ts
@@ -154,6 +154,16 @@ export function nn() {
       authorization_error_instantiate_validation_info_customer_service: 'Om du står fast kontakt oss på brukarservice {0}.',
       starting: 'Hald på hatten, no startar vi!',
     },
+    language: {
+      full_name: {
+        nb: 'Norsk bokmål',
+        en: "Engelsk",
+        nn: "Nynorsk"
+      },
+      selector: {
+        label: 'Språk'
+      }
+    },
     party_selection: {
       error_caption_prefix: 'Feil',
       invalid_selection_first_part: 'Du har starta tenesta som',
diff --git a/src/shared/src/types/index.ts b/src/shared/src/types/index.ts
index 6183c160db..cd0fc1b35f 100644
--- a/src/shared/src/types/index.ts
+++ b/src/shared/src/types/index.ts
@@ -16,7 +16,6 @@ export interface IApplication {
   onEntry?: IOnEntry;
 }
 
-
 export interface IAltinnOrg {
   name: ITitle;
   logo: string;
@@ -45,7 +44,7 @@ export interface IAttachment {
   iconClass: string;
   url: string;
   dataType: string;
-  tags?: string[]
+  tags?: string[];
 }
 
 export interface IData {
@@ -122,9 +121,13 @@ export interface IInstanceState {
   isMarkedForHardDelete: boolean;
   isArchived: boolean;
 }
-
+// Language translations for altinn
 export interface ILanguage {
-    [key: string]: string | ILanguage;
+  [key: string]: string | ILanguage;
+}
+// Language for the rendered alltinn app
+export interface IAppLanguage {
+  language: string; // Language code
 }
 
 export interface IOrganisation {
@@ -250,7 +253,7 @@ export interface IAttachmentGrouping {
   [title: string]: IAttachment[];
 }
 
-export interface IDataSource{
+export interface IDataSource {
   [key: string]: any;
 }