diff --git a/web/app.react.js b/web/app.react.js
--- a/web/app.react.js
+++ b/web/app.react.js
@@ -20,6 +20,7 @@
   ModalProvider,
   useModalContext,
 } from 'lib/components/modal-provider.react.js';
+import { StaffContextProvider } from 'lib/components/staff-provider.react.js';
 import {
   createLoadingStatusSelector,
   combineLoadingStatuses,
@@ -189,8 +190,10 @@
         <>
           <WebEditThreadAvatarProvider>
             <EditUserAvatarProvider>
-              {this.renderMainContent()}
-              {this.props.modals}
+              <StaffContextProvider>
+                {this.renderMainContent()}
+                {this.props.modals}
+              </StaffContextProvider>
             </EditUserAvatarProvider>
           </WebEditThreadAvatarProvider>
         </>
diff --git a/web/settings/build-info-panel.react.js b/web/settings/build-info-panel.react.js
new file mode 100644
--- /dev/null
+++ b/web/settings/build-info-panel.react.js
@@ -0,0 +1,22 @@
+// @flow
+
+import * as React from 'react';
+
+import css from './build-info.css';
+import BuildInfo from './build-info.react.js';
+import PanelHeader from '../components/panel-header.react.js';
+import Panel, { type PanelData } from '../components/panel.react.js';
+
+const panelData: $ReadOnlyArray<PanelData> = [
+  {
+    header: <PanelHeader headerLabel="Build info" />,
+    body: <BuildInfo />,
+    classNameOveride: css.container,
+  },
+];
+
+function BuildInfoPanel(): React.Node {
+  return <Panel panelItems={panelData} />;
+}
+
+export default BuildInfoPanel;
diff --git a/web/settings/build-info.css b/web/settings/build-info.css
new file mode 100644
--- /dev/null
+++ b/web/settings/build-info.css
@@ -0,0 +1,23 @@
+.container {
+  flex: 1;
+}
+
+.contentContainer {
+  padding: 16px;
+  display: flex;
+  flex-direction: column;
+  row-gap: 8px;
+}
+
+.infoRow {
+  display: flex;
+  justify-content: space-between;
+}
+
+.labelText {
+  color: var(--text-background-tertiary-default);
+}
+
+.valueText {
+  color: var(--text-background-secondary-default);
+}
diff --git a/web/settings/build-info.react.js b/web/settings/build-info.react.js
new file mode 100644
--- /dev/null
+++ b/web/settings/build-info.react.js
@@ -0,0 +1,64 @@
+// @flow
+
+import * as React from 'react';
+
+import { useStaffContext } from 'lib/components/staff-provider.react.js';
+import { useIsCurrentUserStaff } from 'lib/shared/staff-utils.js';
+import { getConfig } from 'lib/utils/config.js';
+import { isDev } from 'lib/utils/dev-utils.js';
+
+import css from './build-info.css';
+import { useStaffCanSee } from '../utils/staff-utils.js';
+
+function BuildInfo(): React.Node {
+  const { codeVersion, stateVersion } = getConfig().platformDetails;
+
+  const { staffUserHasBeenLoggedIn } = useStaffContext();
+
+  const staffCanSee = useStaffCanSee();
+
+  const isCurrentUserStaff = useIsCurrentUserStaff();
+
+  const staffOnlyRows = React.useMemo(() => {
+    if (!staffCanSee && !staffUserHasBeenLoggedIn) {
+      return null;
+    }
+
+    return (
+      <>
+        <div className={css.infoRow}>
+          <p className={css.labelText}>__DEV__</p>
+          <p className={css.valueText}>{isDev ? 'TRUE' : 'FALSE'}</p>
+        </div>
+        <div className={css.infoRow}>
+          <p className={css.labelText}>isCurrentUserStaff</p>
+          <p className={css.valueText}>
+            {isCurrentUserStaff ? 'TRUE' : 'FALSE'}
+          </p>
+        </div>
+        <div className={css.infoRow}>
+          <p className={css.labelText}>hasStaffUserLoggedIn</p>
+          <p className={css.valueText}>
+            {staffUserHasBeenLoggedIn ? 'TRUE' : 'FALSE'}
+          </p>
+        </div>
+      </>
+    );
+  }, [isCurrentUserStaff, staffCanSee, staffUserHasBeenLoggedIn]);
+
+  return (
+    <div className={css.contentContainer}>
+      <div className={css.infoRow}>
+        <p className={css.labelText}>Code version</p>
+        <p className={css.valueText}>{codeVersion}</p>
+      </div>
+      <div className={css.infoRow}>
+        <p className={css.labelText}>State version</p>
+        <p className={css.valueText}>{stateVersion}</p>
+      </div>
+      {staffOnlyRows}
+    </div>
+  );
+}
+
+export default BuildInfo;