diff --git a/packages/ui/src/components/Header/HeaderMetadataStatus.module.css b/packages/ui/src/components/Header/HeaderMetadataStatus.module.css
new file mode 100644
index 0000000000..ec4a9c9fd7
--- /dev/null
+++ b/packages/ui/src/components/Header/HeaderMetadataStatus.module.css
@@ -0,0 +1,49 @@
+/*
+ * Copyright 2026 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@layer tokens, base, components, utilities;
+
+@layer components {
+ .single {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: var(--bui-space-2);
+ }
+
+ .dot {
+ width: 8px;
+ height: 8px;
+ border-radius: 50%;
+ flex-shrink: 0;
+ }
+
+ .dot-danger {
+ background-color: var(--bui-fg-danger);
+ }
+
+ .dot-warning {
+ background-color: var(--bui-fg-warning);
+ }
+
+ .dot-success {
+ background-color: var(--bui-fg-success);
+ }
+
+ .dot-info {
+ background-color: var(--bui-fg-info);
+ }
+}
diff --git a/packages/ui/src/components/Header/HeaderMetadataStatus.tsx b/packages/ui/src/components/Header/HeaderMetadataStatus.tsx
new file mode 100644
index 0000000000..fb7229143c
--- /dev/null
+++ b/packages/ui/src/components/Header/HeaderMetadataStatus.tsx
@@ -0,0 +1,50 @@
+/*
+ * Copyright 2026 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { HeaderMetadataStatusProps } from './types';
+import { Text } from '../Text';
+import { Link } from '../Link';
+import styles from './HeaderMetadataStatus.module.css';
+
+/**
+ * Displays a single status indicator as a coloured dot with a label inside a
+ * Header metadata value. Optionally renders the label as a link when href is provided.
+ *
+ * @public
+ */
+export const HeaderMetadataStatus = ({
+ label,
+ color,
+ href,
+}: HeaderMetadataStatusProps) => {
+ return (
+
+ );
+};
diff --git a/packages/ui/src/components/Header/HeaderMetadataUsers.module.css b/packages/ui/src/components/Header/HeaderMetadataUsers.module.css
new file mode 100644
index 0000000000..0b84734b81
--- /dev/null
+++ b/packages/ui/src/components/Header/HeaderMetadataUsers.module.css
@@ -0,0 +1,41 @@
+/*
+ * Copyright 2026 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+@layer tokens, base, components, utilities;
+
+@layer components {
+ .single {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: var(--bui-space-2);
+ }
+
+ .stack {
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ gap: var(--bui-space-1);
+ list-style: none;
+ margin: 0;
+ padding: 0;
+ }
+
+ .avatarLink {
+ display: flex;
+ text-decoration: none;
+ }
+}
diff --git a/packages/ui/src/components/Header/HeaderMetadataUsers.tsx b/packages/ui/src/components/Header/HeaderMetadataUsers.tsx
new file mode 100644
index 0000000000..e4d5c2d07b
--- /dev/null
+++ b/packages/ui/src/components/Header/HeaderMetadataUsers.tsx
@@ -0,0 +1,108 @@
+/*
+ * Copyright 2026 The Backstage Authors
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import type { HeaderMetadataUser } from './types';
+import { Avatar } from '../Avatar';
+import { Tooltip, TooltipTrigger } from '../Tooltip';
+import { Text } from '../Text';
+import { Link } from '../Link';
+import { Pressable } from 'react-aria';
+import styles from './HeaderMetadataUsers.module.css';
+
+/**
+ * Displays a list of users as avatars inside a Header metadata value.
+ * A single user shows the avatar with their name beside it.
+ * Multiple users show avatars in a row with the name revealed on hover via tooltip.
+ * When a user has an `href`, the avatar and name become links.
+ *
+ * @public
+ */
+export const HeaderMetadataUsers = ({
+ users,
+}: {
+ users: HeaderMetadataUser[];
+}) => {
+ if (users.length === 0) return null;
+
+ if (users.length === 1) {
+ const user = users[0];
+ if (user.href) {
+ return (
+
+
+ {user.name}
+
+ );
+ }
+
+ return (
+