diff --git a/packages/oauth-provider/src/assets/app/backend-data.ts b/packages/oauth-provider/src/assets/app/backend-data.ts
index 710ac1396ed..f98e7829f37 100644
--- a/packages/oauth-provider/src/assets/app/backend-data.ts
+++ b/packages/oauth-provider/src/assets/app/backend-data.ts
@@ -1,13 +1,29 @@
 import type { ClientMetadata, Session } from './types'
 
+export type FieldDefinition = {
+  label?: string
+  placeholder?: string
+  pattern?: string
+  title?: string
+}
+
+export type LinkDefinition = {
+  title: string
+  href: string
+  rel?: string
+}
+
 export type CustomizationData = {
   name?: string
   logo?: string
-  links?: Array<{
-    name: string
-    href: string
-    rel?: string
-  }>
+  links?: LinkDefinition[]
+  signIn?: {
+    fields?: {
+      username?: FieldDefinition
+      password?: FieldDefinition
+      remember?: FieldDefinition
+    }
+  }
 }
 
 export type ErrorData = {
diff --git a/packages/oauth-provider/src/assets/app/components/error-card.tsx b/packages/oauth-provider/src/assets/app/components/error-card.tsx
index 75eba692c35..3a41112717b 100644
--- a/packages/oauth-provider/src/assets/app/components/error-card.tsx
+++ b/packages/oauth-provider/src/assets/app/components/error-card.tsx
@@ -13,7 +13,7 @@ export function ErrorCard({
   className,
   ...attrs
 }: Partial<ErrorCardProps> &
-  Omit<HtmlHTMLAttributes<HTMLDivElement>, keyof ErrorCardProps>) {
+  Omit<HtmlHTMLAttributes<HTMLDivElement>, keyof ErrorCardProps | 'children'>) {
   return (
     <div
       {...attrs}
diff --git a/packages/oauth-provider/src/assets/app/components/page-layout.tsx b/packages/oauth-provider/src/assets/app/components/layout-title-page.tsx
similarity index 76%
rename from packages/oauth-provider/src/assets/app/components/page-layout.tsx
rename to packages/oauth-provider/src/assets/app/components/layout-title-page.tsx
index bd4712197d4..c4985c22bed 100644
--- a/packages/oauth-provider/src/assets/app/components/page-layout.tsx
+++ b/packages/oauth-provider/src/assets/app/components/layout-title-page.tsx
@@ -1,25 +1,24 @@
-import { HTMLAttributes, PropsWithChildren, ReactNode } from 'react'
+import { HTMLAttributes, ReactNode } from 'react'
 import { clsx } from '../lib/clsx'
 
-export type PageLayoutProps = {
+export type LayoutTitlePageProps = {
   title?: ReactNode
   subtitle?: ReactNode
 }
 
-export function PageLayout({
+export function LayoutTitlePage({
   children,
   title,
   subtitle,
   ...attrs
-}: PropsWithChildren<
-  PageLayoutProps & Omit<HTMLAttributes<HTMLDivElement>, keyof PageLayoutProps>
->) {
+}: LayoutTitlePageProps &
+  Omit<HTMLAttributes<HTMLDivElement>, keyof LayoutTitlePageProps>) {
   return (
     <div
       {...attrs}
       className={clsx(
         attrs.className,
-        'flex justify-center items-stretch min-h-screen bg-white text-black dark:bg-black dark:text-white',
+        'flex justify-center items-stretch min-h-screen bg-white text-slate-900 dark:bg-slate-900 dark:text-slate-100',
       )}
     >
       <div className="w-1/2 hidden p-4 md:grid content-center justify-items-end text-right dark:bg-transparent dark:border-r bg-slate-100 dark:bg-slate-800 dark:border-slate-700">
diff --git a/packages/oauth-provider/src/assets/app/components/welcome-layout.tsx b/packages/oauth-provider/src/assets/app/components/layout-welcome.tsx
similarity index 78%
rename from packages/oauth-provider/src/assets/app/components/welcome-layout.tsx
rename to packages/oauth-provider/src/assets/app/components/layout-welcome.tsx
index 275c7de641d..e3c02bba5b2 100644
--- a/packages/oauth-provider/src/assets/app/components/welcome-layout.tsx
+++ b/packages/oauth-provider/src/assets/app/components/layout-welcome.tsx
@@ -1,25 +1,25 @@
 import { PropsWithChildren } from 'react'
 
-export type WelcomeLayoutProps = {
+export type LayoutWelcomeProps = {
   name?: string
   logo?: string
   links?: Array<{
-    name: string
+    title: string
     href: string
     rel?: string
   }>
   logoAlt?: string
 }
 
-export function WelcomeLayout({
+export function LayoutWelcome({
   name,
   logo,
   logoAlt = name || 'Logo',
   links,
   children,
-}: PropsWithChildren<WelcomeLayoutProps>) {
+}: PropsWithChildren<LayoutWelcomeProps>) {
   return (
-    <div className="min-h-screen w-full flex items-center justify-center flex-col bg-white text-black dark:bg-black dark:text-white">
+    <div className="min-h-screen w-full flex items-center justify-center flex-col bg-white text-slate-900 dark:bg-slate-900 dark:text-slate-100">
       <div className="w-full max-w-screen-sm overflow-hidden flex-grow flex flex-col items-center justify-center">
         {logo && (
           <img
@@ -39,7 +39,7 @@ export function WelcomeLayout({
       </div>
 
       {links != null && links.length > 0 && (
-        <nav className="w-full max-w-screen-sm overflow-hidden mt-4 border-t border-t-slate-200 flex flex-wrap justify-center">
+        <nav className="w-full max-w-screen-sm overflow-hidden mt-4 border-t border-t-slate-200 dark:border-t-slate-700 flex flex-wrap justify-center">
           {links.map((link) => (
             <a
               key={link.href}
@@ -48,7 +48,7 @@ export function WelcomeLayout({
               target="_blank"
               className="m-2 md:m-4 text-xs md:text-sm text-primary hover:underline"
             >
-              {link.name}
+              {link.title}
             </a>
           ))}
         </nav>
diff --git a/packages/oauth-provider/src/assets/app/components/sign-in-form.tsx b/packages/oauth-provider/src/assets/app/components/sign-in-form.tsx
index d23aef4b1a1..3a0009a3e6c 100644
--- a/packages/oauth-provider/src/assets/app/components/sign-in-form.tsx
+++ b/packages/oauth-provider/src/assets/app/components/sign-in-form.tsx
@@ -1,9 +1,9 @@
 import {
+  FormHTMLAttributes,
   ReactNode,
+  SyntheticEvent,
   useCallback,
   useState,
-  FormHTMLAttributes,
-  SyntheticEvent,
 } from 'react'
 
 import { clsx } from '../lib/clsx'
@@ -12,7 +12,7 @@ import { ErrorCard } from './error-card'
 export type SignInFormOutput = {
   username: string
   password: string
-  remember: boolean
+  remember?: boolean
 }
 
 export type SignInFormProps = {
@@ -26,18 +26,25 @@ export type SignInFormProps = {
   cancelLabel?: ReactNode
   cancelAria?: string
 
-  username?: string
+  usernameDefault?: string
   usernameReadonly?: boolean
+  usernameLabel?: string
   usernamePlaceholder?: string
   usernameAria?: string
+  usernamePattern?: string
+  usernameTitle?: string
 
+  passwordLabel?: string
   passwordPlaceholder?: string
-  passwordAria?: string
   passwordWarning?: ReactNode
+  passwordAria?: string
+  passwordPattern?: string
+  passwordTitle?: string
 
-  remember?: boolean
+  rememberVisible?: boolean
+  rememberDefault?: boolean
+  rememberLabel?: string
   rememberAria?: string
-  rememberLabel?: ReactNode
 }
 
 export function SignInForm({
@@ -51,13 +58,19 @@ export function SignInForm({
   cancelAria = 'Cancel',
   cancelLabel = cancelAria,
 
-  username: defaultUsername = '',
+  usernameDefault = '',
   usernameReadonly = false,
-  usernamePlaceholder = 'Username or email address',
-  usernameAria = usernamePlaceholder,
-
-  passwordPlaceholder = 'Password',
-  passwordAria = passwordPlaceholder,
+  usernameLabel = 'Username',
+  usernameAria = usernameLabel,
+  usernamePlaceholder = usernameLabel,
+  usernamePattern,
+  usernameTitle = 'Username must not be empty',
+
+  passwordLabel = 'Password',
+  passwordAria = passwordLabel,
+  passwordPlaceholder = passwordLabel,
+  passwordPattern,
+  passwordTitle = 'Password must not be empty',
   passwordWarning = (
     <>
       <p className="font-bold">Warning</p>
@@ -68,30 +81,29 @@ export function SignInForm({
     </>
   ),
 
-  remember: defaultRemember = false,
-  rememberAria = 'Remember this account on this device',
-  rememberLabel = rememberAria,
+  rememberVisible = true,
+  rememberDefault = false,
+  rememberLabel = 'Remember this account on this device',
+  rememberAria = rememberLabel,
 
   className,
   ...attrs
 }: SignInFormProps &
-  Omit<FormHTMLAttributes<HTMLFormElement>, keyof SignInFormProps>) {
+  Omit<
+    FormHTMLAttributes<HTMLFormElement>,
+    keyof SignInFormProps | 'children'
+  >) {
   const [focused, setFocused] = useState(false)
   const [loading, setLoading] = useState(false)
   const [errorMessage, setErrorMessage] = useState<string | null>(null)
 
-  const [hasUsername, setHasUsername] = useState(!!defaultUsername)
-  const [hasPassword, setHasPassword] = useState(false)
-
-  const canSubmit = hasUsername && hasPassword
-
   const doSubmit = useCallback(
     async (
       event: SyntheticEvent<
         HTMLFormElement & {
           username: HTMLInputElement
           password: HTMLInputElement
-          remember: HTMLInputElement
+          remember?: HTMLInputElement
         },
         SubmitEvent
       >,
@@ -101,11 +113,9 @@ export function SignInForm({
       const credentials = {
         username: event.currentTarget.username.value,
         password: event.currentTarget.password.value,
-        remember: event.currentTarget.remember.checked,
+        remember: event.currentTarget.remember?.checked,
       }
 
-      if (!credentials.username || !credentials.password) return
-
       setLoading(true)
       setErrorMessage(null)
       try {
@@ -135,10 +145,7 @@ export function SignInForm({
           <input
             name="username"
             type="text"
-            onChange={(e) => {
-              setHasUsername(!!e.target.value)
-              setErrorMessage(null)
-            }}
+            onChange={() => setErrorMessage(null)}
             className="relative m-0 block w-[1px] min-w-0 flex-auto px-3 py-[0.25rem] leading-[1.6] bg-transparent bg-clip-padding text-base text-inherit outline-none dark:placeholder:text-neutral-100 disabled:text-gray-500"
             placeholder={usernamePlaceholder}
             aria-label={usernameAria}
@@ -149,9 +156,11 @@ export function SignInForm({
             dir="auto"
             enterKeyHint="next"
             required
-            defaultValue={defaultUsername}
+            defaultValue={usernameDefault}
             readOnly={usernameReadonly}
             disabled={usernameReadonly}
+            pattern={usernamePattern}
+            title={usernameTitle}
           />
         </div>
 
@@ -162,10 +171,7 @@ export function SignInForm({
           <input
             name="password"
             type="password"
-            onChange={(e) => {
-              setHasPassword(!!e.target.value)
-              setErrorMessage(null)
-            }}
+            onChange={() => setErrorMessage(null)}
             onFocus={() => setFocused(true)}
             onBlur={() => setTimeout(setFocused, 100, false)}
             className="relative m-0 block w-[1px] min-w-0 flex-auto px-3 py-[0.25rem] leading-[1.6] bg-transparent bg-clip-padding text-base text-inherit outline-none dark:placeholder:text-neutral-100"
@@ -173,11 +179,13 @@ export function SignInForm({
             aria-label={passwordAria}
             autoCapitalize="none"
             autoCorrect="off"
-            autoComplete="password"
+            autoComplete="current-password"
             dir="auto"
             enterKeyHint="done"
             spellCheck="false"
             required
+            pattern={passwordPattern}
+            title={passwordTitle}
           />
         </div>
 
@@ -210,46 +218,48 @@ export function SignInForm({
           </>
         )}
 
-        <hr className="border-slate-200 dark:border-slate-700" />
-
-        <div className="relative p-1 flex flex-wrap items-center justify-stretch">
-          <span className="w-8 flex items-center justify-center">
-            <input
-              className="text-primary"
-              id="remember"
-              name="remember"
-              type="checkbox"
-              defaultChecked={defaultRemember}
-              aria-label={rememberAria}
-              onChange={() => setErrorMessage(null)}
-            />
-          </span>
-
-          <label
-            htmlFor="remember"
-            className="relative m-0 block w-[1px] min-w-0 flex-auto px-3 py-[0.25rem] leading-[1.6]"
-          >
-            {rememberLabel}
-          </label>
-        </div>
+        {rememberVisible && (
+          <>
+            <hr className="border-slate-200 dark:border-slate-700" />
+
+            <div className="relative p-1 flex flex-wrap items-center justify-stretch">
+              <span className="w-8 flex items-center justify-center">
+                <input
+                  className="text-primary"
+                  id="remember"
+                  name="remember"
+                  type="checkbox"
+                  defaultChecked={rememberDefault}
+                  aria-label={rememberAria}
+                  onChange={() => setErrorMessage(null)}
+                />
+              </span>
+
+              <label
+                htmlFor="remember"
+                className="relative m-0 block w-[1px] min-w-0 flex-auto px-3 py-[0.25rem] leading-[1.6]"
+              >
+                {rememberLabel}
+              </label>
+            </div>
+          </>
+        )}
       </fieldset>
 
-      {errorMessage && <ErrorCard className="mt-2" message={errorMessage} />}
+      {errorMessage && <ErrorCard className="mt-4" message={errorMessage} />}
 
       <div className="flex-auto" />
 
-      <div className="p-4 flex flex-wrap items-center justify-between">
-        {canSubmit && (
-          <button
-            className="py-2 bg-transparent text-primary rounded-md font-semibold order-last"
-            type="submit"
-            role="Button"
-            aria-label={submitAria}
-            disabled={loading}
-          >
-            {submitLabel}
-          </button>
-        )}
+      <div className="p-4 flex flex-wrap items-center justify-start">
+        <button
+          className="py-2 bg-transparent text-primary rounded-md font-semibold order-last"
+          type="submit"
+          role="Button"
+          aria-label={submitAria}
+          disabled={loading}
+        >
+          {submitLabel}
+        </button>
 
         {onCancel && (
           <button
@@ -262,17 +272,19 @@ export function SignInForm({
             {cancelLabel}
           </button>
         )}
+
+        <div className="flex-auto" />
       </div>
     </form>
   )
 }
 
 function parseErrorMessage(err: unknown): string {
+  console.error('Sign-in failed:', err)
   switch ((err as any)?.message) {
     case 'Invalid credentials':
       return 'Invalid username or password'
     default:
-      console.error(err)
       return 'An unknown error occurred'
   }
 }
diff --git a/packages/oauth-provider/src/assets/app/hooks/use-api.ts b/packages/oauth-provider/src/assets/app/hooks/use-api.ts
index 06e704dfe1f..b93dd0afa4a 100644
--- a/packages/oauth-provider/src/assets/app/hooks/use-api.ts
+++ b/packages/oauth-provider/src/assets/app/hooks/use-api.ts
@@ -1,11 +1,16 @@
 import { useCallback, useMemo, useState } from 'react'
 
 import { AuthorizeData } from '../backend-data'
-import { SignInFormOutput } from '../components/sign-in-form'
 import { Api } from '../lib/api'
+import { upsert } from '../lib/util'
 import { Account, Session } from '../types'
 import { useCsrfToken } from './use-csrf-token'
-import { upsert } from '../lib/util'
+
+export type SignInCredentials = {
+  username: string
+  password: string
+  remember?: boolean
+}
 
 export function useApi(
   {
@@ -49,7 +54,7 @@ export function useApi(
   )
 
   const doSignIn = useCallback(
-    async (credentials: SignInFormOutput): Promise<void> => {
+    async (credentials: SignInCredentials): Promise<void> => {
       const session = await api.signIn(credentials)
       const { sub } = session.account
 
diff --git a/packages/oauth-provider/src/assets/app/views/accept-view.tsx b/packages/oauth-provider/src/assets/app/views/accept-view.tsx
index 99b2bfc3621..cc694372445 100644
--- a/packages/oauth-provider/src/assets/app/views/accept-view.tsx
+++ b/packages/oauth-provider/src/assets/app/views/accept-view.tsx
@@ -1,5 +1,5 @@
 import { AcceptForm } from '../components/accept-form'
-import { PageLayout } from '../components/page-layout'
+import { LayoutTitlePage } from '../components/layout-title-page'
 import { ClientMetadata, Session } from '../types'
 
 export type AcceptViewProps = {
@@ -22,7 +22,7 @@ export function AcceptView({
 }: AcceptViewProps) {
   const { account } = session
   return (
-    <PageLayout
+    <LayoutTitlePage
       title="Authorize"
       subtitle={
         <>
@@ -41,6 +41,6 @@ export function AcceptView({
         onAccept={onAccept}
         onReject={onReject}
       />
-    </PageLayout>
+    </LayoutTitlePage>
   )
 }
diff --git a/packages/oauth-provider/src/assets/app/views/authorize-view.tsx b/packages/oauth-provider/src/assets/app/views/authorize-view.tsx
index b005eabf04c..eaa574ba49b 100644
--- a/packages/oauth-provider/src/assets/app/views/authorize-view.tsx
+++ b/packages/oauth-provider/src/assets/app/views/authorize-view.tsx
@@ -1,12 +1,12 @@
 import { useEffect, useState } from 'react'
 
 import type { AuthorizeData, CustomizationData } from '../backend-data'
-import { PageLayout } from '../components/page-layout'
-import { useBoundDispatch } from '../hooks/use-bound-dispatch'
+import { LayoutTitlePage } from '../components/layout-title-page'
 import { useApi } from '../hooks/use-api'
+import { useBoundDispatch } from '../hooks/use-bound-dispatch'
+import { AcceptView } from './accept-view'
 import { SignInView } from './sign-in-view'
 import { WelcomeView } from './welcome-view'
-import { AcceptView } from './accept-view'
 
 export type AuthorizeViewProps = {
   authorizeData: AuthorizeData
@@ -57,6 +57,7 @@ export function AuthorizeView({
   if (view === 'sign-in') {
     return (
       <SignInView
+        fields={customizationData?.signIn?.fields}
         loginHint={authorizeData.loginHint}
         sessions={sessions}
         setSession={setSession}
@@ -74,12 +75,17 @@ export function AuthorizeView({
         clientMetadata={authorizeData.clientMetadata}
         onAccept={() => doAccept(session.account)}
         onReject={doReject}
-        onBack={() => setSession(null)}
+        onBack={() => {
+          setSession(null)
+          setView(sessions.length ? 'sign-in' : 'welcome')
+        }}
       />
     )
   }
 
   return (
-    <PageLayout title="Login complete">You are being redirected...</PageLayout>
+    <LayoutTitlePage title="Login complete">
+      You are being redirected...
+    </LayoutTitlePage>
   )
 }
diff --git a/packages/oauth-provider/src/assets/app/views/error-view.tsx b/packages/oauth-provider/src/assets/app/views/error-view.tsx
index 5a3f00922a4..90a664d3abd 100644
--- a/packages/oauth-provider/src/assets/app/views/error-view.tsx
+++ b/packages/oauth-provider/src/assets/app/views/error-view.tsx
@@ -1,6 +1,6 @@
 import { CustomizationData, ErrorData } from '../backend-data'
 import { ErrorCard } from '../components/error-card'
-import { WelcomeLayout } from '../components/welcome-layout'
+import { LayoutWelcome } from '../components/layout-welcome'
 
 export type ErrorViewProps = {
   customizationData?: CustomizationData
@@ -9,9 +9,9 @@ export type ErrorViewProps = {
 
 export function ErrorView({ errorData, customizationData }: ErrorViewProps) {
   return (
-    <WelcomeLayout {...customizationData}>
+    <LayoutWelcome {...customizationData}>
       <ErrorCard message={getUserFriendlyMessage(errorData)} />
-    </WelcomeLayout>
+    </LayoutWelcome>
   )
 }
 
diff --git a/packages/oauth-provider/src/assets/app/views/sign-in-view.tsx b/packages/oauth-provider/src/assets/app/views/sign-in-view.tsx
index 1acd4bca946..522b10fb7c1 100644
--- a/packages/oauth-provider/src/assets/app/views/sign-in-view.tsx
+++ b/packages/oauth-provider/src/assets/app/views/sign-in-view.tsx
@@ -1,7 +1,8 @@
 import { useCallback, useEffect, useMemo, useState } from 'react'
 
+import { FieldDefinition } from '../backend-data'
 import { AccountPicker } from '../components/account-picker'
-import { PageLayout } from '../components/page-layout'
+import { LayoutTitlePage } from '../components/layout-title-page'
 import { SignInForm, SignInFormOutput } from '../components/sign-in-form'
 import { Session } from '../types'
 
@@ -10,6 +11,12 @@ export type SignInViewProps = {
   setSession: (sub: string | null) => void
   loginHint?: string
 
+  fields?: {
+    username?: FieldDefinition
+    password?: FieldDefinition
+    remember?: FieldDefinition
+  }
+
   onSignIn: (credentials: SignInFormOutput) => void | PromiseLike<void>
   onBack?: () => void
 }
@@ -18,6 +25,7 @@ export function SignInView({
   loginHint,
   sessions,
   setSession,
+  fields,
 
   onSignIn,
   onBack,
@@ -39,63 +47,111 @@ export function SignInView({
     if (!session.loginRequired) return null
 
     return (
-      <PageLayout title="Sign in" subtitle="Confirm your password to continue">
+      <LayoutTitlePage
+        title="Sign in"
+        subtitle="Confirm your password to continue"
+      >
         <SignInForm
           className="max-w-lg w-full"
-          remember={true}
-          username={session.account.preferred_username}
-          usernameReadonly={true}
           onSubmit={onSignIn}
           onCancel={clearSession}
           cancelLabel="Back" // to account picker
+          usernameDefault={session.account.preferred_username}
+          usernameReadonly={true}
+          usernameLabel={fields?.username?.label}
+          usernamePlaceholder={fields?.username?.placeholder}
+          usernamePattern={fields?.username?.pattern}
+          usernameTitle={fields?.username?.title}
+          passwordLabel={fields?.password?.label}
+          passwordPlaceholder={fields?.password?.placeholder}
+          passwordPattern={fields?.password?.pattern}
+          passwordTitle={fields?.password?.title}
+          rememberDefault={true}
+          rememberLabel={fields?.remember?.label}
         />
-      </PageLayout>
+      </LayoutTitlePage>
     )
   }
 
   if (loginHint) {
     return (
-      <PageLayout title="Sign in" subtitle="Enter your password">
+      <LayoutTitlePage title="Sign in" subtitle="Enter your password">
         <SignInForm
           className="max-w-lg w-full"
-          username={loginHint}
-          usernameReadonly={true}
           onSubmit={onSignIn}
           onCancel={onBack}
           cancelLabel="Back"
+          usernameDefault={loginHint}
+          usernameReadonly={true}
+          usernameLabel={fields?.username?.label}
+          usernamePlaceholder={fields?.username?.placeholder}
+          usernamePattern={fields?.username?.pattern}
+          usernameTitle={fields?.username?.title}
+          passwordLabel={fields?.password?.label}
+          passwordPlaceholder={fields?.password?.placeholder}
+          passwordPattern={fields?.password?.pattern}
+          passwordTitle={fields?.password?.title}
+          rememberLabel={fields?.remember?.label}
         />
-      </PageLayout>
+      </LayoutTitlePage>
     )
   }
 
   if (sessions.length === 0) {
     return (
-      <PageLayout title="Sign in" subtitle="Enter your username and password">
+      <LayoutTitlePage
+        title="Sign in"
+        subtitle="Enter your username and password"
+      >
         <SignInForm
           className="max-w-lg w-full"
           onSubmit={onSignIn}
           onCancel={onBack}
           cancelLabel="Back"
+          usernameLabel={fields?.username?.label}
+          usernamePlaceholder={fields?.username?.placeholder}
+          usernamePattern={fields?.username?.pattern}
+          usernameTitle={fields?.username?.title}
+          passwordLabel={fields?.password?.label}
+          passwordPlaceholder={fields?.password?.placeholder}
+          passwordPattern={fields?.password?.pattern}
+          passwordTitle={fields?.password?.title}
+          rememberLabel={fields?.remember?.label}
         />
-      </PageLayout>
+      </LayoutTitlePage>
     )
   }
 
   if (showSignInForm) {
     return (
-      <PageLayout title="Sign in" subtitle="Enter your username and password">
+      <LayoutTitlePage
+        title="Sign in"
+        subtitle="Enter your username and password"
+      >
         <SignInForm
           className="max-w-lg w-full"
           onSubmit={onSignIn}
           onCancel={() => setShowSignInForm(false)}
           cancelLabel="Back" // to account picker
+          usernameLabel={fields?.username?.label}
+          usernamePlaceholder={fields?.username?.placeholder}
+          usernamePattern={fields?.username?.pattern}
+          usernameTitle={fields?.username?.title}
+          passwordLabel={fields?.password?.label}
+          passwordPlaceholder={fields?.password?.placeholder}
+          passwordPattern={fields?.password?.pattern}
+          passwordTitle={fields?.password?.title}
+          rememberLabel={fields?.remember?.label}
         />
-      </PageLayout>
+      </LayoutTitlePage>
     )
   }
 
   return (
-    <PageLayout title="Sign in as..." subtitle="Select an account to continue.">
+    <LayoutTitlePage
+      title="Sign in as..."
+      subtitle="Select an account to continue."
+    >
       <AccountPicker
         className="max-w-lg w-full"
         accounts={accounts}
@@ -104,6 +160,6 @@ export function SignInView({
         onBack={onBack}
         backLabel="Back" // to previous view
       />
-    </PageLayout>
+    </LayoutTitlePage>
   )
 }
diff --git a/packages/oauth-provider/src/assets/app/views/welcome-view.tsx b/packages/oauth-provider/src/assets/app/views/welcome-view.tsx
index 89ad54f3456..576d3bea8d6 100644
--- a/packages/oauth-provider/src/assets/app/views/welcome-view.tsx
+++ b/packages/oauth-provider/src/assets/app/views/welcome-view.tsx
@@ -1,7 +1,7 @@
-import { WelcomeLayout, WelcomeLayoutProps } from '../components/welcome-layout'
+import { LayoutWelcome, LayoutWelcomeProps } from '../components/layout-welcome'
 import { clsx } from '../lib/clsx'
 
-export type WelcomeViewParams = WelcomeLayoutProps & {
+export type WelcomeViewParams = LayoutWelcomeProps & {
   onSignIn?: () => void
   signInLabel?: string
 
@@ -23,7 +23,7 @@ export function WelcomeView({
   ...props
 }: WelcomeViewParams) {
   return (
-    <WelcomeLayout {...props}>
+    <LayoutWelcome {...props}>
       {onSignUp && (
         <button
           className={clsx(
@@ -39,8 +39,8 @@ export function WelcomeView({
       {onSignIn && (
         <button
           className={clsx(
-            'm-1 w-60 max-w-full text-black py-2 px-4 rounded-full truncate',
-            onSignUp ? 'bg-slate-200' : 'bg-primary',
+            'm-1 w-60 max-w-full py-2 px-4 rounded-full truncate',
+            onSignUp ? 'bg-slate-100 dark:bg-slate-700' : 'bg-primary',
           )}
           onClick={onSignIn}
         >
@@ -56,6 +56,6 @@ export function WelcomeView({
           {cancelLabel}
         </button>
       )}
-    </WelcomeLayout>
+    </LayoutWelcome>
   )
 }
diff --git a/packages/oauth-provider/src/output/customization.ts b/packages/oauth-provider/src/output/customization.ts
index 610a708b38f..8265019779d 100644
--- a/packages/oauth-provider/src/output/customization.ts
+++ b/packages/oauth-provider/src/output/customization.ts
@@ -4,26 +4,43 @@ type ColorName = typeof colorNames[number]
 const isColorName = (name: string): name is ColorName =>
   (colorNames as readonly string[]).includes(name)
 
+export type FieldDefinition = {
+  label?: string
+  placeholder?: string
+  pattern?: string
+  title?: string
+}
+
 export type Customization = {
   name?: string
   logo?: string
   colors?: { [_ in ColorName]?: string }
   links?: Array<{
-    name: string
+    title: string
     href: string
     rel?: string
   }>
+
+  signIn?: {
+    fields?: {
+      username?: FieldDefinition
+      password?: FieldDefinition
+      remember?: FieldDefinition
+    }
+  }
 }
 
 export function buildCustomizationData({
   name,
   logo,
   links,
+  signIn,
 }: Customization = {}) {
   return {
     name,
     logo,
     links,
+    signIn,
   }
 }
 
diff --git a/packages/pds/example.env b/packages/pds/example.env
index 37e17331f29..4a833a09769 100644
--- a/packages/pds/example.env
+++ b/packages/pds/example.env
@@ -31,6 +31,8 @@ PDS_OAUTH_PROVIDER_PRIMARY_COLOR="#7507e3"
 PDS_OAUTH_PROVIDER_ERROR_COLOR=
 PDS_OAUTH_PROVIDER_HOME_LINK=
 PDS_OAUTH_PROVIDER_TOS_LINK=
+PDS_OAUTH_PROVIDER_POLICY_LINK=
+PDS_OAUTH_PROVIDER_SUPPORT_LINK=
 
 # Debugging
 NODE_TLS_REJECT_UNAUTHORIZED=1
diff --git a/packages/pds/src/config/config.ts b/packages/pds/src/config/config.ts
index 60ee0d0039d..c80f6fd7536 100644
--- a/packages/pds/src/config/config.ts
+++ b/packages/pds/src/config/config.ts
@@ -1,6 +1,7 @@
 import path from 'node:path'
 import assert from 'node:assert'
 import { DAY, HOUR, SECOND } from '@atproto/common'
+import { Customization } from '@atproto/oauth-provider'
 import { ServerEnvironment } from './env'
 
 // off-config but still from env:
@@ -251,19 +252,39 @@ export const envToCfg = (env: ServerEnvironment): ServerConfig => {
             },
             links: [
               {
-                name: 'Home',
+                title: 'Home',
                 href: env.oauthProviderHomeLink,
-                rel: 'home',
+                rel: 'bookmark',
               },
               {
-                name: 'Terms of Service',
+                title: 'Terms of Service',
                 href: env.oauthProviderTosLink,
                 rel: 'terms-of-service',
               },
+              {
+                title: 'Privacy Policy',
+                href: env.oauthProviderPrivacyPolicyLink,
+                rel: 'privacy-policy',
+              },
+              {
+                title: 'Support',
+                href: env.oauthProviderSupportLink,
+                rel: 'help',
+              },
             ].filter(
               (f): f is typeof f & { href: NonNullable<typeof f['href']> } =>
                 f.href != null,
             ),
+            signIn: {
+              fields: {
+                username: {
+                  label: 'Email address or handle',
+                  pattern: '.{3,}',
+                  title: 'Must be at least 3 characters long',
+                },
+                password: {},
+              },
+            },
           },
         },
       }
@@ -377,19 +398,7 @@ export type OAuthConfig = {
     | false
     | {
         disableSsrf: boolean
-        customization: {
-          name: string
-          logo?: string
-          colors?: {
-            primary?: string
-            error?: string
-          }
-          links?: Array<{
-            name: string
-            href: string
-            rel?: string
-          }>
-        }
+        customization: Customization
       }
 }
 
diff --git a/packages/pds/src/config/env.ts b/packages/pds/src/config/env.ts
index 3aaf50cf3e0..c86e14b20d3 100644
--- a/packages/pds/src/config/env.ts
+++ b/packages/pds/src/config/env.ts
@@ -114,6 +114,8 @@ export const readEnv = (): ServerEnvironment => {
     oauthProviderErrorColor: envStr('PDS_OAUTH_PROVIDER_ERROR_COLOR'),
     oauthProviderHomeLink: envStr('PDS_OAUTH_PROVIDER_HOME_LINK'),
     oauthProviderTosLink: envStr('PDS_OAUTH_PROVIDER_TOS_LINK'),
+    oauthProviderPrivacyPolicyLink: envStr('PDS_OAUTH_PROVIDER_POLICY_LINK'),
+    oauthProviderSupportLink: envStr('PDS_OAUTH_PROVIDER_SUPPORT_LINK'),
   }
 }
 
@@ -225,4 +227,6 @@ export type ServerEnvironment = {
   oauthProviderErrorColor?: string
   oauthProviderHomeLink?: string
   oauthProviderTosLink?: string
+  oauthProviderPrivacyPolicyLink?: string
+  oauthProviderSupportLink?: string
 }