diff --git a/front/src/components/ArticleCreate.jsx b/front/src/components/ArticleCreate.jsx
index 5ce791f76..eba807a9a 100644
--- a/front/src/components/ArticleCreate.jsx
+++ b/front/src/components/ArticleCreate.jsx
@@ -75,7 +75,7 @@ export default function ArticleCreate ({ onSubmit }) {
 
   return (
     <section>
-      <form onSubmit={handleSubmit}>
+      <form onSubmit={handleSubmit} className={styles.form}>
         <Field
           ref={titleInputRef}
           {...titleBindings}
diff --git a/front/src/components/Credentials.jsx b/front/src/components/Credentials.jsx
index f1055c01d..804447b67 100644
--- a/front/src/components/Credentials.jsx
+++ b/front/src/components/Credentials.jsx
@@ -2,7 +2,6 @@ import React, { useMemo, useState } from 'react'
 import { useSelector } from 'react-redux'
 import { useTranslation } from 'react-i18next'
 
-
 import { useGraphQL } from '../helpers/graphQL'
 import { changePassword as query } from './Credentials.graphql'
 import styles from './credentials.module.scss'
@@ -92,7 +91,7 @@ export default function Credentials () {
           disabled={!canSubmit}
           primary={true}
         >
-          {isUpdating ? 'Updating…' : 'Change'}
+          {isUpdating ? t('credentials.updatePassword.updatingButton') : t('credentials.updatePassword.confirmButton')}
         </Button>
       </form>
     </section>
diff --git a/front/src/components/Login.jsx b/front/src/components/Login.jsx
index adf1cbab5..57ed18ce2 100644
--- a/front/src/components/Login.jsx
+++ b/front/src/components/Login.jsx
@@ -70,8 +70,8 @@ export default function Login () {
       </section>
 
       <section className={styles.box}>
-        <h1 className={styles.loginTitle}>Welcome to Stylo!</h1>
-        <form onSubmit={handleSubmit}>
+        <h1>Welcome to Stylo!</h1>
+        <form onSubmit={handleSubmit} className={styles.loginForm}>
           <fieldset>
             <legend>
               Connect with a Huma-Num account <small>(recommended)</small>
@@ -82,7 +82,7 @@ export default function Login () {
               <a href="https://humanum.hypotheses.org/5754#content">How does it work?</a>
             </p>
 
-            <p className={styles.authenticationProviderLinks}>
+            <p>
               <a
                 className={styles.humaNumConnectBtn}
                 href={backendEndpoint + '/login/openid'}
diff --git a/front/src/components/Select.jsx b/front/src/components/Select.jsx
index 9764e0f7c..9130dfa7b 100644
--- a/front/src/components/Select.jsx
+++ b/front/src/components/Select.jsx
@@ -4,14 +4,8 @@ import fieldStyles from './field.module.scss'
 import { clsx } from 'clsx'
 
 const Select = forwardRef((props, forwardedRef) => {
-  const alignLabel = props.alignLabel !== false
   return (<div className={clsx(fieldStyles.field, 'control-field')} ref={forwardedRef}>
-    {props.label && <label htmlFor={props.id} style={
-      alignLabel ? {
-        flexBasis: "10rem",
-        textAlign: "end"
-      } : {}
-    }>{props.label}</label>}
+    {props.label && <label htmlFor={props.id}>{props.label}</label>}
     <div className={styles.selectContainer}>
       <select className={props.className || styles.select} {...props}>{props.children}</select>
     </div>
diff --git a/front/src/components/SelectUser.jsx b/front/src/components/SelectUser.jsx
deleted file mode 100644
index ff98e0ffe..000000000
--- a/front/src/components/SelectUser.jsx
+++ /dev/null
@@ -1,30 +0,0 @@
-import React, { useCallback } from 'react'
-import { useDispatch } from 'react-redux'
-import { Users } from 'react-feather'
-
-import Select from './Select'
-
-import styles from './articles.module.scss'
-import buttonStyles from './button.module.scss'
-import clsx from 'clsx'
-import { useActiveUserId } from '../hooks/user'
-
-export default function SelectUser ({ accounts }) {
-  const dispatch = useDispatch()
-
-  const currentUserId = useActiveUserId()
-  const setCurrentUserId = useCallback((userId) => dispatch({ type: 'USER_PREFERENCES_TOGGLE', key: 'currentUser', value: userId }), [])
-
-  const handleCurrentUserChange = useCallback((event) => {
-    setCurrentUserId(event.target.value)
-  }, [currentUserId])
-
-  return (<div className={styles.switchAccount}>
-    <Users/>
-    <Select className={clsx(styles.accountSelect, buttonStyles.select)} value={currentUserId} onChange={handleCurrentUserChange}>
-      {accounts.map((userAccount) => <option key={`userAccount_${userAccount._id}`} value={userAccount._id}>
-        {userAccount.displayName}
-      </option>)}
-    </Select>
-  </div>)
-}
diff --git a/front/src/components/TagCreate.module.scss b/front/src/components/TagCreate.module.scss
index 3265e472d..ecfad16e3 100644
--- a/front/src/components/TagCreate.module.scss
+++ b/front/src/components/TagCreate.module.scss
@@ -21,4 +21,10 @@ fieldset {
 
 .create {
   margin: 2rem 0 1rem;
+  
+  > form {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+  }
 }
diff --git a/front/src/components/UserInfos.jsx b/front/src/components/UserInfos.jsx
index c7075f9de..311a54b5d 100644
--- a/front/src/components/UserInfos.jsx
+++ b/front/src/components/UserInfos.jsx
@@ -1,5 +1,6 @@
 import React, { useState, useCallback } from 'react'
 import { Check, Clipboard, Loader } from 'react-feather'
+import { useTranslation } from 'react-i18next'
 import { useSelector, useDispatch, shallowEqual } from 'react-redux'
 import { CopyToClipboard } from 'react-copy-to-clipboard'
 
@@ -15,6 +16,7 @@ import MonacoYamlEditor from './Write/providers/monaco/YamlEditor'
 
 export default function UserInfos () {
   const dispatch = useDispatch()
+  const { t } = useTranslation()
   const runQuery = useGraphQL()
   const activeUser = useSelector(state => state.activeUser, shallowEqual)
   const zoteroToken = useSelector(state => state.activeUser.zoteroToken)
@@ -26,7 +28,10 @@ export default function UserInfos () {
   const [yaml, setYaml] = useState(activeUser.yaml)
   const [isSaving, setIsSaving] = useState(false)
 
-  const updateActiveUserDetails = useCallback((payload) => dispatch({ type: `UPDATE_ACTIVE_USER_DETAILS`, payload }), [])
+  const updateActiveUserDetails = useCallback((payload) => dispatch({
+    type: `UPDATE_ACTIVE_USER_DETAILS`,
+    payload
+  }), [])
   const clearZoteroToken = useCallback(() => dispatch({ type: 'CLEAR_ZOTERO_TOKEN' }), [])
   const handleYamlUpdate = useCallback((yaml) => setYaml(yaml), [])
 
@@ -52,98 +57,96 @@ export default function UserInfos () {
   }, [activeUser._id, yaml, displayName, firstName, lastName, institution])
 
   return (<>
-    <section className={styles.section}>
-      <h2>Account information</h2>
-      <form onSubmit={updateInfo}>
-        <Field
-          id="displayNameField"
-          label="Display name"
-          type="text"
-          value={displayName}
-          onChange={(e) => setDisplayName(etv(e))}
-          placeholder="Display name"
-        />
-        <Field
-          id="firstNameField"
-          label="First Name"
-          type="text"
-          value={firstName}
-          onChange={(e) => setFirstName(etv(e))}
-          placeholder="First name"
-        />
-        <Field
-          id="lastNameField"
-          label="Last Name"
-          type="text"
-          value={lastName}
-          onChange={(e) => setLastName(etv(e))}
-          placeholder="Last name"
-        />
-        <Field
-          id="institutionField"
-          label="Institution"
-          type="text"
-          value={institution}
-          onChange={(e) => setInstitution(etv(e))}
-          placeholder="Institution name"
-        />
-        <Field id="yamlField" label="Default YAML">
-          <MonacoYamlEditor
-            id="yamlField"
-            text={activeUser.yaml}
-            onTextUpdate={handleYamlUpdate}
+      <section className={styles.section}>
+        <h2>{t('user.account.title')}</h2>
+        <form onSubmit={updateInfo} className={styles.form}>
+          <Field
+            id="displayNameField"
+            label={t('user.account.displayName')}
+            type="text"
+            value={displayName}
+            onChange={(e) => setDisplayName(etv(e))}
           />
-        </Field>
-        <Field  label="Zotero">
-          <>
-            {zoteroToken && <span>Linked with <b>{zoteroToken}</b> account.</span>}
-            {!zoteroToken && <span>No linked account.</span>}
-            {zoteroToken && (
-              <Button title="Unlink this Zotero account" onClick={unlinkZoteroAccount}>
-                Unlink
-              </Button>
-            )}
-          </>
-        </Field>
+          <Field
+            id="firstNameField"
+            label={t('user.account.firstName')}
+            type="text"
+            value={firstName}
+            onChange={(e) => setFirstName(etv(e))}
+          />
+          <Field
+            id="lastNameField"
+            label={t('user.account.lastName')}
+            type="text"
+            value={lastName}
+            onChange={(e) => setLastName(etv(e))}
+          />
+          <Field
+            id="institutionField"
+            label={t('user.account.institution')}
+            type="text"
+            value={institution}
+            onChange={(e) => setInstitution(etv(e))}
+          />
+          <Field id="yamlField" label="Default YAML">
+            <MonacoYamlEditor
+              id="yamlField"
+              text={activeUser.yaml}
+              onTextUpdate={handleYamlUpdate}
+            />
+          </Field>
+          <Field label="Zotero" className={styles.zotero}>
+            <>
+              {zoteroToken && <span>Linked with <code>{zoteroToken}</code> account.</span>}
+              {!zoteroToken && <span>No linked account.</span>}
+              {zoteroToken && (
+                <Button title="Unlink this Zotero account" onClick={unlinkZoteroAccount}>
+                  Unlink
+                </Button>
+              )}
+            </>
+          </Field>
+          <div className={formStyles.footer}>
+            <Button primary={true} disabled={isSaving}>
+              {isSaving ? <Loader/> : <Check/>}
+              Save changes
+            </Button>
+          </div>
+        </form>
+      </section>
 
-        <div className={formStyles.footer}>
-          <Button primary={true} disabled={isSaving}>
-            {isSaving ? <Loader /> : <Check />}
-            Save changes
-          </Button>
+      <section className={styles.section}>
+        <div className={styles.info}>
+          <Field label={t("user.account.email")}>
+            <>{activeUser.email}</>
+          </Field>
+          {activeUser.username && <Field label="Username"><>{activeUser.username}</>
+          </Field>}
+          <Field label={t("user.account.authentication")}>
+            <>{activeUser.authType === 'oidc' ? 'OpenID (External)' : 'Password'}</>
+          </Field>
+          <Field label={t("user.account.apiKey")} className={styles.apiKeyField}>
+            <>
+              <code className={styles.apiKeyValue} title={t("user.account.apiKeyValue", {token: sessionToken})}>{sessionToken}</code>
+              <CopyToClipboard text={sessionToken}>
+                <Button title={t("user.account.copyApiKey")} icon={true}>
+                  <Clipboard/>
+                </Button>
+              </CopyToClipboard>
+            </>
+          </Field>
+          <Field label={t("user.account.id")}>
+            <code>{activeUser._id}</code>
+          </Field>
+          {activeUser.admin && <Field label="Admin">✔️</Field>}
+          <Field label={t("user.account.createdAt")}>
+            <TimeAgo date={activeUser.createdAt}/>
+          </Field>
+          <Field label={t("user.account.updatedAt")}>
+            <TimeAgo date={activeUser.updatedAt}/>
+          </Field>
         </div>
-      </form>
-    </section>
-
-    <section className={styles.section}>
-      <Field label="Email">
-        <>{activeUser.email}</>
-      </Field>
-      {activeUser.username && <Field label="Username"><>{activeUser.username}</></Field>}
-      <Field label="Authentication">
-        <>{activeUser.authType === 'oidc' ? 'OpenID (External)' : 'Password'}</>
-      </Field>
-      <Field label="API Key">
-        <>
-          <code className={styles.apiKey} title={`API Key value is ${sessionToken}`}>{sessionToken}</code>
-          <CopyToClipboard text={sessionToken}>
-            <Button title="Copy API Key value to clipboard" icon={true}>
-              <Clipboard />
-            </Button>
-          </CopyToClipboard>
-        </>
-      </Field>
-      <Field label="Identifier">
-        <code>{activeUser._id}</code>
-      </Field>
-      {activeUser.admin && <Field label="Admin">✔️</Field>}
-      <Field label="Created">
-        <TimeAgo date={activeUser.createdAt}/>
-      </Field>
-      <Field label="Updated">
-        <TimeAgo date={activeUser.updatedAt}/>
-      </Field>
-    </section>
-  </>
+      </section>
+    </>
   )
 }
diff --git a/front/src/components/articleCreate.module.scss b/front/src/components/articleCreate.module.scss
index 88549a0e6..a0fabe681 100644
--- a/front/src/components/articleCreate.module.scss
+++ b/front/src/components/articleCreate.module.scss
@@ -2,9 +2,6 @@
 @use '../styles/variables' as *;
 
 .titleField {
-  label {
-    flex-basis: 5rem;
-  }
   input {
     width: 100%;
   }
@@ -25,16 +22,19 @@
   }
 }
 
-.field {
+.form {
   display: flex;
-  margin-bottom: 0.5rem;
-  margin-top: 0.5rem;
+  flex-direction: column;
+  gap: 1rem;
+}
 
+.field {
+  display: flex;
+  flex-direction: column;
+  padding: 0 0 0.25rem;
+  
   > label {
-    flex-shrink: 0;
-    margin-right: 1rem;
-    padding: calc(0.5em - 1px) 0;
-    flex-basis: 5rem;
-    text-align: end;
+    font-weight: 600;
+    padding: 0 0 0.25rem;
   }
 }
diff --git a/front/src/components/corpus/CorpusCreate.jsx b/front/src/components/corpus/CorpusCreate.jsx
index eb8e50ace..1e379fde5 100644
--- a/front/src/components/corpus/CorpusCreate.jsx
+++ b/front/src/components/corpus/CorpusCreate.jsx
@@ -58,7 +58,7 @@ export default function CorpusCreate ({onSubmit}) {
 
   return (
     <section>
-      <form onSubmit={handleSubmit}>
+      <form onSubmit={handleSubmit} className={styles.form}>
         <Field
           ref={titleInputRef}
           {...titleBindings}
diff --git a/front/src/components/corpus/CorpusUpdate.jsx b/front/src/components/corpus/CorpusUpdate.jsx
index 48410e183..2975bf688 100644
--- a/front/src/components/corpus/CorpusUpdate.jsx
+++ b/front/src/components/corpus/CorpusUpdate.jsx
@@ -7,7 +7,7 @@ import Field from '../Field.jsx'
 
 import { updateCorpus } from "./Corpus.graphql"
 
-import styles from './corpusEdit.module.scss'
+import styles from './corpusUpdate.module.scss'
 
 
 export default function CorpusUpdate ({corpus, onSubmit}) {
@@ -53,7 +53,7 @@ export default function CorpusUpdate ({corpus, onSubmit}) {
 
   return (
     <section>
-      <form onSubmit={handleSubmit}>
+      <form onSubmit={handleSubmit} className={styles.form}>
         <Field
           ref={titleInputRef}
           {...titleBindings}
diff --git a/front/src/components/corpus/corpusCreate.module.scss b/front/src/components/corpus/corpusCreate.module.scss
index 517fd7bda..8aa1c424c 100644
--- a/front/src/components/corpus/corpusCreate.module.scss
+++ b/front/src/components/corpus/corpusCreate.module.scss
@@ -1,17 +1,18 @@
 @use '../../styles/defaults' as *;
 @use '../../styles/variables' as *;
 
+.form {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
 .controlField {
   display: flex;
+  flex-direction: column;
   label {
-    flex-shrink: 0;
-    margin-right: 1rem;
-    padding: calc(0.5em - 1px) 0;
-    flex-basis: 10rem;
-    text-align: end;
-  }
-  div {
-    flex: 1;
+    font-weight: 600;
+    padding: 0 0 0.25rem;
   }
 }
 
diff --git a/front/src/components/corpus/corpusEdit.module.scss b/front/src/components/corpus/corpusUpdate.module.scss
similarity index 57%
rename from front/src/components/corpus/corpusEdit.module.scss
rename to front/src/components/corpus/corpusUpdate.module.scss
index 517fd7bda..8aa1c424c 100644
--- a/front/src/components/corpus/corpusEdit.module.scss
+++ b/front/src/components/corpus/corpusUpdate.module.scss
@@ -1,17 +1,18 @@
 @use '../../styles/defaults' as *;
 @use '../../styles/variables' as *;
 
+.form {
+  display: flex;
+  flex-direction: column;
+  gap: 1rem;
+}
+
 .controlField {
   display: flex;
+  flex-direction: column;
   label {
-    flex-shrink: 0;
-    margin-right: 1rem;
-    padding: calc(0.5em - 1px) 0;
-    flex-basis: 10rem;
-    text-align: end;
-  }
-  div {
-    flex: 1;
+    font-weight: 600;
+    padding: 0 0 0.25rem;
   }
 }
 
diff --git a/front/src/components/credentials.module.scss b/front/src/components/credentials.module.scss
index 82274871f..64726fc7a 100644
--- a/front/src/components/credentials.module.scss
+++ b/front/src/components/credentials.module.scss
@@ -17,9 +17,31 @@
   }
 }
 
+.form {
+  display: flex;
+  flex-direction: column;
+  gap: 0.5rem
+}
+
+.zotero {
+  > form {
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+  }
+}
+
+.info {
+  display: flex;
+  flex-direction: column;
+  gap: 0.75rem
+}
+
 .passwordForm {
   display: flex;
   flex-wrap: wrap;
+  padding-top: 1rem;
+  padding-bottom: 1rem;
 }
 
 .warningMessage {
@@ -31,10 +53,21 @@
   gap: .5rem;
   padding: .5rem;
 }
+.apiKeyField {
+  :global {
+    & .control {
+      border: 1px solid $main-border-color;
+      display: flex;
+      align-items: center;
+      max-width: 50%;
+      align-self: start;
+      padding-left: 0.5rem;
+    }
+  }
+}
 
-.apiKey {
+.apiKeyValue {
   display: inline-block;
-  max-width: 50%;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
diff --git a/front/src/components/field.module.scss b/front/src/components/field.module.scss
index df7690830..b70052e82 100644
--- a/front/src/components/field.module.scss
+++ b/front/src/components/field.module.scss
@@ -28,16 +28,11 @@
 .field {
   display: flex;
   align-items: flex-start;
-
-  &, & ~ button {
-    margin-bottom: .5rem;
-    margin-top: .5rem;
-  }
+  flex-direction: column;
 
   label {
-    flex-shrink: 0;
-    margin-right: 1rem;
-    padding: calc(0.5em - 1px) 0;
+    font-weight: 600;
+    padding: 0 0 0.25rem;
 
     &[for] {
       cursor: pointer;
@@ -104,7 +99,7 @@
 
 .footer {
   margin: 1rem 0 0;
-  padding-left: calc(10rem + 1rem);
+  align-self: flex-end;
 }
 
 .inlineFields {
diff --git a/front/src/components/login.module.scss b/front/src/components/login.module.scss
index 5458f20b1..0df9c8a57 100644
--- a/front/src/components/login.module.scss
+++ b/front/src/components/login.module.scss
@@ -13,7 +13,6 @@
   background-color: $extra-background-color;
   margin: 1rem auto;
 
-
   :last-child {
     margin-bottom: 0;
   }
@@ -25,17 +24,22 @@
   }
 
   form > fieldset {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
     border: 0;
     margin: 0 0 1em 0;
     padding: 0;
 
-
     legend {
       font-weight: bold;
       margin: 0 0 1rem;
+      padding: 0;
+      font-size: 1.1rem;
 
       + .help {
         margin-top: -1rem;
+        margin-bottom: 0;
       }
     }
   }
@@ -112,10 +116,6 @@ a.humaNumConnectBtn {
   }
 }
 
-.authenticationProviderLinks {
-  margin: 2em 0;
-}
-
 .actions {
   display: flex;
   align-items: center;
diff --git a/front/src/locales/en/translation.json b/front/src/locales/en/translation.json
index 496e4ea65..302a26393 100644
--- a/front/src/locales/en/translation.json
+++ b/front/src/locales/en/translation.json
@@ -1,4 +1,19 @@
 {
+  "user.account.title": "Account information",
+  "user.account.displayName": "Display name",
+  "user.account.firstName": "First name",
+  "user.account.lastName": "Last name",
+  "user.account.institution": "Institution",
+  "user.account.id": "Identifier",
+  "user.account.email": "Email",
+  "user.account.createdAt": "Account created",
+  "user.account.updatedAt": "Account updated",
+  "user.account.apiKey": "API access key",
+  "user.account.authentication": "Authentication type",
+  "user.account.copyApiKey": "Copy API key value to clipboard",
+  "user.account.apiKeyValue": "API key value is: {{token}}",
+  "credentials.updatePassword.updatingButton": "Updating…",
+  "credentials.updatePassword.confirmButton": "Update",
   "workspace.myspace": "My space",
   "workspace.description.label": "Description",
   "workspace.createdBy.label": "by",
diff --git a/front/src/locales/fr/translation.json b/front/src/locales/fr/translation.json
index 872bf50e2..a6fa5bf44 100644
--- a/front/src/locales/fr/translation.json
+++ b/front/src/locales/fr/translation.json
@@ -1,4 +1,19 @@
 {
+  "user.account.title": "Information du compte",
+  "user.account.displayName": "Nom d'affichage",
+  "user.account.firstName": "Prénom",
+  "user.account.lastName": "Nom",
+  "user.account.institution": "Institution",
+  "user.account.id": "Identifiant",
+  "user.account.email": "Courriel",
+  "user.account.createdAt": "Compte crée",
+  "user.account.updatedAt": "Compte mis à jour",
+  "user.account.apiKey": "Clé d'accès à l'API",
+  "user.account.authentication": "Type d'authentification",
+  "user.account.copyApiKey": "Copier la clé d'accès à l'API dans le presse-papier",
+  "user.account.apiKeyValue": "La valeur de la clé d'API est : {{token}}",
+  "credentials.updatePassword.updatingButton": "Mise à jour…",
+  "credentials.updatePassword.confirmButton": "Mettre à jour",
   "workspace.myspace": "Mon espace",
   "workspace.description.label": "Description",
   "workspace.createdBy.label": "par",