diff --git a/frontend/public/locales/en/invite.json b/frontend/public/locales/en/invite.json
new file mode 100644
index 0000000000000000000000000000000000000000..70693d275ab5a2c20d9513f1854d1fa4e0643844
--- /dev/null
+++ b/frontend/public/locales/en/invite.json
@@ -0,0 +1,6 @@
+{
+  "description": "Please choose how you want to log in to complete your registration. The recommended way is to log in with either Feide or ID-porten. If that is not possible you can manually fill out the registration form with your passport number.",
+  "header": "Guest Registration",
+  "login": "Log in with FEIDE",
+  "manual": "Registrate manually"
+}
diff --git a/frontend/public/locales/nb/invite.json b/frontend/public/locales/nb/invite.json
new file mode 100644
index 0000000000000000000000000000000000000000..6f6b73f0d316f226596aeaa894184030db619f91
--- /dev/null
+++ b/frontend/public/locales/nb/invite.json
@@ -0,0 +1,6 @@
+{
+  "description": "Vennligst velg hvordan du vil logge inn for å fullføre registreringen. Den anbefalte metoden er å logge inn gjennom Feide eller ID-porten. Dersom det ikke er mulig kan du fylle ut registreringskjemaet manuelt med passnummer",
+  "header": "Gjestetjenesten",
+  "login": "Logg inn med FEIDE",
+  "manual": "Registrer manuelt"
+}
diff --git a/frontend/public/locales/nn/invite.json b/frontend/public/locales/nn/invite.json
new file mode 100644
index 0000000000000000000000000000000000000000..abb2afaf0747f645944c94525cc49b28015e87bf
--- /dev/null
+++ b/frontend/public/locales/nn/invite.json
@@ -0,0 +1,6 @@
+{
+  "description": "Ver venleg og vel korleis du vil logge inn for å fullføre registreringa. Den anbefalte metoden er å logge inn gjennom Feide eller ID-porten. Dersom det ikkje er mogeleg kan du fylle ut registreringskjemaet manuelt med passnummer",
+  "header": "Gjestetjenesten",
+  "login": "Logg inn med FEIDE",
+  "manual": "Registrer manuelt"
+}
diff --git a/frontend/src/components/button/index.tsx b/frontend/src/components/button/index.tsx
index 86754f65372556a64daa8da31e431fc5a0aff776..255b7af8f01ad8b96e6e9a7bb1e9984ddbd076f7 100644
--- a/frontend/src/components/button/index.tsx
+++ b/frontend/src/components/button/index.tsx
@@ -8,7 +8,11 @@ interface IHrefButton {
 
 function HrefButton({ to, children }: IHrefButton) {
   return (
-    <Button variant="contained" href={to} sx={{ backgroundColor: '#18191C' }}>
+    <Button
+      variant="contained"
+      href={to}
+      sx={{ backgroundColor: 'theme.palette.secondary' }}
+    >
       {children}
     </Button>
   )
diff --git a/frontend/src/components/button/linebutton.tsx b/frontend/src/components/button/linebutton.tsx
new file mode 100644
index 0000000000000000000000000000000000000000..a5ec984a2ab7adc84a396576b829789fcf00771a
--- /dev/null
+++ b/frontend/src/components/button/linebutton.tsx
@@ -0,0 +1,18 @@
+import React from 'react'
+import { Button } from '@mui/material'
+
+interface IHrefButton {
+  to: string
+  children: React.ReactNode
+}
+
+function HrefLineButton({ to, children }: IHrefButton) {
+  return (
+    <Button href={to} sx={{ color: 'theme.palette.secondary' }}>
+      {children}
+    </Button>
+  )
+}
+
+// eslint-disable-next-line import/prefer-default-export
+export { HrefLineButton }
diff --git a/frontend/src/routes/invite/index.tsx b/frontend/src/routes/invite/index.tsx
index 2edc66658d9b3f67443f542e25f704c525a7fcf1..ba43e2d7c2a31266e2f209d6a838d44099b22f48 100644
--- a/frontend/src/routes/invite/index.tsx
+++ b/frontend/src/routes/invite/index.tsx
@@ -1,20 +1,29 @@
+import { useTranslation } from 'react-i18next'
 import Page from 'components/page'
-import { useUserContext } from 'contexts'
-import { Link } from 'react-router-dom'
+
+import { styled } from '@mui/material/styles'
+
+import { HrefButton } from 'components/button'
+import { HrefLineButton } from 'components/button/linebutton'
+
+const FlexDiv = styled('div')(() => ({
+  display: 'flex',
+  gap: '0.5rem',
+}))
 
 function Invite() {
-  const { user } = useUserContext()
+  const { t } = useTranslation(['invite'])
 
   return (
     <Page>
+      <h1>{t('header')}</h1>
       <p>
-        {user.first_name} {user.last_name}
-        TODO: Put information about login options, and buttons to them on this
-        page
+        {t('description')}
       </p>
-      After login or when clicking on the manual registration option, the user
-      should be sent here:
-      <Link to="/guestregister/">Guest Registration</Link>
+      <FlexDiv>
+        <HrefButton to="/oidc/authenticate/">{t('login')}</HrefButton>
+        <HrefLineButton to="/guestregister/">{t('manual')}</HrefLineButton>
+      </FlexDiv>
     </Page>
   )
 }