diff --git a/apps/www/src/content/docs/components/combobox/demo.ts b/apps/www/src/content/docs/components/combobox/demo.ts
index 71fb48d4b..bcdd15c73 100644
--- a/apps/www/src/content/docs/components/combobox/demo.ts
+++ b/apps/www/src/content/docs/components/combobox/demo.ts
@@ -78,13 +78,13 @@ export const groupDemo = {
     <Combobox.Input placeholder="Search items" width={240} />
     <Combobox.Content>
       <Combobox.Group>
-        <Combobox.Label>Fruits</Combobox.Label>
+        <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>
         <Combobox.Item value="apple">Apple</Combobox.Item>
         <Combobox.Item value="banana">Banana</Combobox.Item>
       </Combobox.Group>
       <Combobox.Separator />
       <Combobox.Group>
-        <Combobox.Label>Vegetables</Combobox.Label>
+        <Combobox.GroupLabel>Vegetables</Combobox.GroupLabel>
         <Combobox.Item value="carrot">Carrot</Combobox.Item>
         <Combobox.Item value="broccoli">Broccoli</Combobox.Item>
       </Combobox.Group>
@@ -92,6 +92,40 @@ export const groupDemo = {
   </Combobox>`
 };
 
+export const labelDemo = {
+  type: 'code',
+  code: `
+  <Combobox multiple>
+    <Flex direction="column" gap={2}>
+      <Combobox.Label>Fruits</Combobox.Label>
+      <Flex align="center" gap={2}>
+        <Combobox.Input placeholder="Select fruits" width={300} />
+        <Combobox.Clear />
+      </Flex>
+    </Flex>
+    <Combobox.Content>
+      <Combobox.Item>Apple</Combobox.Item>
+      <Combobox.Item>Banana</Combobox.Item>
+      <Combobox.Item>Grape</Combobox.Item>
+      <Combobox.Item>Orange</Combobox.Item>
+    </Combobox.Content>
+  </Combobox>`
+};
+
+export const emptyDemo = {
+  type: 'code',
+  code: `
+  <Combobox>
+    <Combobox.Input placeholder="Type 'xyz'" width={240} />
+    <Combobox.Content>
+      <Combobox.Empty>No fruit matches your search</Combobox.Empty>
+      <Combobox.Item>Apple</Combobox.Item>
+      <Combobox.Item>Banana</Combobox.Item>
+      <Combobox.Item>Grape</Combobox.Item>
+    </Combobox.Content>
+  </Combobox>`
+};
+
 export const iconDemo = {
   type: 'code',
   code: `
diff --git a/apps/www/src/content/docs/components/combobox/index.mdx b/apps/www/src/content/docs/components/combobox/index.mdx
index ad9c2c0be..05e0923f1 100644
--- a/apps/www/src/content/docs/components/combobox/index.mdx
+++ b/apps/www/src/content/docs/components/combobox/index.mdx
@@ -13,6 +13,8 @@ import {
   withFieldDemo,
   controlledDemo,
   createItemsDemo,
+  labelDemo,
+  emptyDemo,
 } from "./demo.ts";
 
 <Demo data={playground} />
@@ -25,8 +27,18 @@ Import and assemble the component:
 import { Combobox } from "@raystack/apsara";
 
 <Combobox>
+  <Combobox.Label />
   <Combobox.Input />
-  <Combobox.Content />
+  <Combobox.Clear />
+  <Combobox.Content>
+    <Combobox.Empty />
+    <Combobox.Status />
+    <Combobox.Group>
+      <Combobox.GroupLabel />
+      <Combobox.Item />
+    </Combobox.Group>
+    <Combobox.Separator />
+  </Combobox.Content>
 </Combobox>
 ```
 
@@ -54,7 +66,7 @@ Wrap the Combobox with [Field](/docs/components/field) to add a label, descripti
 
 ### Groups and separators
 
-Organize items into groups with labels and visual separators. Groups and labels are automatically hidden when the user is searching.
+Organize items into groups with `Combobox.GroupLabel` and separators. Groups, group labels, and separators are hidden while the user is searching.
 
 <Demo data={groupDemo} />
 
@@ -64,8 +76,22 @@ Pass the `multiple` prop to enable multi-select. Selected values appear as chips
 
 Each chip shows its value as text. To show a label instead, pass `itemToStringLabel` to the root. Values in the `{ value, label }` shape show their `label` without it.
 
+The input shows the first two chips and a "+N" count for the rest. Press Backspace in an empty input to remove the last value. Press Left Arrow at the start of the input to move focus to the chips. On a focused chip, press Backspace or Delete to remove it.
+
 <Demo data={multipleDemo} />
 
+### Label and clear button
+
+`Combobox.Label` renders a visible label linked to the input. `Combobox.Clear` renders a button that clears the value. It shows only when there is a value or input text. Place both anywhere inside `Combobox`.
+
+<Demo data={labelDemo} />
+
+### Empty state
+
+`Combobox.Content` shows "No results" when no item matches the input. To change the text, add `Combobox.Empty` as a direct child of `Combobox.Content`.
+
+<Demo data={emptyDemo} />
+
 ### Controlled
 
 Use `value` and `onValueChange` for controlled behavior.
@@ -114,17 +140,41 @@ When no `value` prop is provided, the text content of `children` is used as the
 
 <auto-type-table path="./props.ts" name="ComboboxItemProps" />
 
+### Label Props
+
+A visible label for the input. It renders a `<label>` whose `htmlFor` is the input `id`. Inside a [Field](/docs/components/field), use the Field label instead.
+
+<auto-type-table path="./props.ts" name="ComboboxLabelProps" />
+
+### Clear Props
+
+A button that clears the value and the input text. It renders [IconButton](/docs/components/icon-button) and shows only when there is something to clear.
+
+<auto-type-table path="./props.ts" name="ComboboxClearProps" />
+
+### Empty Props
+
+The text shown when no item matches the input. `Combobox.Content` renders one with "No results" by default. Add `Combobox.Empty` as a direct child of `Combobox.Content` to change the text. Pass `null` as children to show nothing.
+
+<auto-type-table path="./props.ts" name="ComboboxEmptyProps" />
+
+### Status Props
+
+A visually hidden live region. Screen readers announce its text when it changes. `Combobox.Content` renders one by default that announces the number of matching items, for example "3 results". Add `Combobox.Status` as a direct child of `Combobox.Content` to change the text, for example to announce loading.
+
+<auto-type-table path="./props.ts" name="ComboboxStatusProps" />
+
 ### Group Props
 
 A way to group related combobox items together.
 
 <auto-type-table path="./props.ts" name="ComboboxGroupProps" />
 
-### Label Props
+### GroupLabel Props
 
-Renders a label in a combobox group. This component should be wrapped with `Combobox.Group`.
+Renders a label in a combobox group. Wrap it in `Combobox.Group`.
 
-<auto-type-table path="./props.ts" name="ComboboxLabelProps" />
+<auto-type-table path="./props.ts" name="ComboboxGroupLabelProps" />
 
 ### Separator Props
 
@@ -138,12 +188,20 @@ Every rendered part carries a stable `data-slot` attribute for [styling and test
 
 | Slot | Element |
 |------|---------|
+| `combobox-label` | The label for the input |
 | `combobox-input` | The text input that opens the popup |
+| `combobox-chips` | The container for chips and the input in multiple mode |
+| `combobox-chip` | A selected value in multiple mode |
+| `combobox-chip-remove` | The button that removes a chip |
+| `combobox-chip-overflow` | The "+N" count of chips that are not shown |
+| `combobox-clear` | The button that clears the value |
 | `combobox-positioner` | Wrapper that positions the popup |
 | `combobox-content` | The popup container |
+| `combobox-status` | The hidden live region that announces the number of results |
+| `combobox-empty` | The text shown when no item matches |
 | `combobox-list` | The scrollable list of items |
 | `combobox-group` | A group of related items |
-| `combobox-label` | The label for a group |
+| `combobox-group-label` | The label for a group |
 | `combobox-separator` | The divider between items or groups |
 | `combobox-item` | A selectable option row |
 | `combobox-item-text` | The text label inside an item (when its children is a string) |
@@ -160,7 +218,11 @@ Every rendered part carries a stable `data-slot` attribute for [styling and test
   the whole time, so typing to filter never loses the user's place.
 - In multiple mode, each item renders a checkbox that mirrors its selected
   state, and selected values appear in the input as removable chips.
+- The chips use Base UI's `Combobox.Chips`, which has `role="toolbar"`. Arrow
+  keys move between chips, and Backspace or Delete removes the focused chip.
+- `Combobox.Empty` and `Combobox.Status` are polite live regions. Screen
+  readers announce "No results" and the number of matching items.
 - Group labels use Base UI's `Combobox.GroupLabel`, which links the label to
-  its group via `aria-labelledby`, so wrap `Combobox.Label` in `Combobox.Group`.
+  its group via `aria-labelledby`, so wrap `Combobox.GroupLabel` in `Combobox.Group`.
 - Wrap the Combobox with [Field](/docs/components/field) to associate a
   visible label, description, and error message with the input.
diff --git a/apps/www/src/content/docs/components/combobox/props.ts b/apps/www/src/content/docs/components/combobox/props.ts
index 6908fd723..0e37683e6 100644
--- a/apps/www/src/content/docs/components/combobox/props.ts
+++ b/apps/www/src/content/docs/components/combobox/props.ts
@@ -60,6 +60,9 @@ export interface ComboboxRootProps {
 
   /** Converts a value to the text shown in the input and in multi-select chips. */
   itemToStringLabel?: (value: string) => string;
+
+  /** The `id` of the input. `Combobox.Label` uses it. */
+  id?: string;
 }
 
 export interface ComboboxInputProps {
@@ -138,6 +141,65 @@ export interface ComboboxGroupProps {
 }
 
 export interface ComboboxLabelProps {
+  /** Shows `optionalText` after the label when `false`. */
+  required?: boolean;
+
+  /**
+   * Text shown after the label when `required` is `false`.
+   * @default "(optional)"
+   */
+  optionalText?: string;
+
+  /** Additional CSS class names. */
+  className?: string;
+}
+
+export interface ComboboxClearProps {
+  /**
+   * Size of the button.
+   * @default 2
+   */
+  size?: 1 | 2 | 3 | 4;
+
+  /**
+   * Accessible name of the button.
+   * @default "Clear"
+   */
+  'aria-label'?: string;
+
+  /**
+   * The icon inside the button.
+   * @default <ClearIcon />
+   */
+  children?: React.ReactNode;
+
+  /** Additional CSS class names. */
+  className?: string;
+}
+
+export interface ComboboxEmptyProps {
+  /**
+   * The text shown when no item matches.
+   * @default "No results"
+   */
+  children?: React.ReactNode;
+
+  /** Additional CSS class names. */
+  className?: string;
+}
+
+export interface ComboboxStatusProps {
+  /**
+   * The text to announce.
+   * @defaultValue The number of matching items, for example "3 results"
+   */
+  children?: React.ReactNode;
+
+  /** Additional CSS class names. */
+  className?: string;
+}
+
+export interface ComboboxGroupLabelProps {
   /** Additional CSS class names. */
   className?: string;
 }
diff --git a/packages/react/components/combobox/__tests__/combobox.test.tsx b/packages/react/components/combobox/__tests__/combobox.test.tsx
index 19e28f859..440220c83 100644
--- a/packages/react/components/combobox/__tests__/combobox.test.tsx
+++ b/packages/react/components/combobox/__tests__/combobox.test.tsx
@@ -350,13 +350,13 @@ describe('Combobox', () => {
           <Combobox.Input placeholder='Select' />
           <Combobox.Content>
             <Combobox.Group>
-              <Combobox.Label>Fruits</Combobox.Label>
+              <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>
               <Combobox.Item value='apple'>Apple</Combobox.Item>
               <Combobox.Item value='banana'>Banana</Combobox.Item>
             </Combobox.Group>
             <Combobox.Separator />
             <Combobox.Group>
-              <Combobox.Label>Vegetables</Combobox.Label>
+              <Combobox.GroupLabel>Vegetables</Combobox.GroupLabel>
               <Combobox.Item value='carrot'>Carrot</Combobox.Item>
               <Combobox.Item value='broccoli'>Broccoli</Combobox.Item>
             </Combobox.Group>
@@ -382,7 +382,7 @@ describe('Combobox', () => {
           <Combobox.Input placeholder='Select' />
           <Combobox.Content>
             <Combobox.Group>
-              <Combobox.Label>Fruits</Combobox.Label>
+              <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>
               <Combobox.Item value='apple'>Apple</Combobox.Item>
             </Combobox.Group>
           </Combobox.Content>
@@ -567,3 +567,189 @@ describe('Combobox.createItems', () => {
     });
   });
 });
+
+describe('Combobox chips', () => {
+  // Without `items` on the root, chips show the raw value.
+  it('renders chips in a toolbar', () => {
+    render(<BasicCombobox multiple defaultValue={['apple', 'banana']} />);
+    const toolbar = screen.getByRole('toolbar');
+    expect(toolbar).toContainElement(screen.getByRole('combobox'));
+    expect(screen.getByText('apple')).toBeInTheDocument();
+    expect(screen.getByText('banana')).toBeInTheDocument();
+  });
+
+  it('removes the last chip on Backspace in an empty input', async () => {
+    const user = userEvent.setup();
+    const handleValueChange = vi.fn();
+    render(
+      <BasicCombobox
+        multiple
+        defaultValue={['apple', 'banana']}
+        onValueChange={handleValueChange}
+      />
+    );
+    await user.click(screen.getByRole('combobox'));
+    await user.keyboard('{Backspace}');
+
+    expect(handleValueChange).toHaveBeenLastCalledWith(['apple']);
+    expect(
+      screen.queryByRole('button', { name: 'Remove banana' })
+    ).not.toBeInTheDocument();
+  });
+
+  it('removes the last value on Backspace when chips overflow', async () => {
+    const user = userEvent.setup();
+    const handleValueChange = vi.fn();
+    render(
+      <BasicCombobox
+        multiple
+        defaultValue={['apple', 'banana', 'grapes', 'pineapple']}
+        onValueChange={handleValueChange}
+      />
+    );
+    expect(screen.getByText('+2')).toBeInTheDocument();
+
+    await user.click(screen.getByRole('combobox'));
+    await user.keyboard('{Backspace}');
+
+    expect(handleValueChange).toHaveBeenLastCalledWith([
+      'apple',
+      'banana',
+      'grapes'
+    ]);
+    expect(screen.getByText('+1')).toBeInTheDocument();
+  });
+
+  it('removes a chip with its remove button', async () => {
+    const user = userEvent.setup();
+    const handleValueChange = vi.fn();
+    render(
+      <BasicCombobox
+        multiple
+        defaultValue={['apple', 'banana']}
+        onValueChange={handleValueChange}
+      />
+    );
+    await user.click(screen.getByRole('button', { name: 'Remove apple' }));
+
+    expect(handleValueChange).toHaveBeenLastCalledWith(['banana']);
+    expect(
+      screen.queryByRole('button', { name: 'Remove apple' })
+    ).not.toBeInTheDocument();
+  });
+});
+
+describe('Combobox.Clear', () => {
+  it('clears all selected values', async () => {
+    const user = userEvent.setup();
+    const handleValueChange = vi.fn();
+    render(
+      <Combobox
+        multiple
+        defaultValue={['apple', 'banana']}
+        onValueChange={handleValueChange}
+      >
+        <Combobox.Input placeholder={PLACEHOLDER_TEXT} />
+        <Combobox.Clear />
+        <Combobox.Content>
+          {FRUIT_OPTIONS.map(option => (
+            <Combobox.Item key={option.value} value={option.value}>
+              {option.label}
+            </Combobox.Item>
+          ))}
+        </Combobox.Content>
+      </Combobox>
+    );
+    await user.click(screen.getByRole('button', { name: 'Clear' }));
+
+    expect(handleValueChange).toHaveBeenLastCalledWith([]);
+    expect(screen.getByRole('combobox')).toHaveAttribute(
+      'placeholder',
+      PLACEHOLDER_TEXT
+    );
+  });
+});
+
+describe('Combobox.Empty', () => {
+  it('shows "No results" only when nothing matches', async () => {
+    const user = userEvent.setup();
+    render(<BasicCombobox />);
+    const input = screen.getByRole('combobox');
+
+    await user.type(input, 'app');
+    await screen.findByText('Apple');
+    expect(screen.queryByText('No results')).not.toBeInTheDocument();
+
+    await user.type(input, 'zzz');
+    expect(await screen.findByText('No results')).toBeInTheDocument();
+  });
+
+  it('works with items on the root', async () => {
+    const user = userEvent.setup();
+    render(
+      <Combobox items={FRUIT_OPTIONS.map(option => option.label)}>
+        <Combobox.Input placeholder={PLACEHOLDER_TEXT} />
+        <Combobox.Content>
+          {(item: string) => (
+            <Combobox.Item key={item} value={item}>
+              {item}
+            </Combobox.Item>
+          )}
+        </Combobox.Content>
+      </Combobox>
+    );
+    const input = screen.getByRole('combobox');
+
+    await user.type(input, 'ban');
+    await screen.findByText('Banana');
+    expect(screen.queryByText('No results')).not.toBeInTheDocument();
+
+    await user.type(input, 'zzz');
+    expect(await screen.findByText('No results')).toBeInTheDocument();
+  });
+
+  it('renders custom text outside the listbox', async () => {
+    const user = userEvent.setup();
+    render(
+      <Combobox>
+        <Combobox.Input placeholder={PLACEHOLDER_TEXT} />
+        <Combobox.Content>
+          <Combobox.Empty>No fruit found</Combobox.Empty>
+          <Combobox.Item value='apple'>Apple</Combobox.Item>
+        </Combobox.Content>
+      </Combobox>
+    );
+    await user.type(screen.getByRole('combobox'), 'zzz');
+
+    const empty = await screen.findByText('No fruit found');
+    expect(empty).toHaveAttribute('role', 'status');
+    expect(screen.getByRole('listbox')).not.toContainElement(empty);
+  });
+});
+
+describe('Combobox.Status', () => {
+  it('announces the number of matching items', async () => {
+    const user = userEvent.setup();
+    render(<BasicCombobox />);
+    await user.type(screen.getByRole('combobox'), 'b');
+
+    await waitFor(() => {
+      expect(screen.getByText('2 results')).toHaveAttribute('role', 'status');
+    });
+  });
+});
+
+describe('Combobox.Label', () => {
+  it('labels the input', () => {
+    render(
+      <Combobox>
+        <Combobox.Label>Fruit</Combobox.Label>
+        <Combobox.Input placeholder={PLACEHOLDER_TEXT} />
+        <Combobox.Content>
+          <Combobox.Item value='apple'>Apple</Combobox.Item>
+        </Combobox.Content>
+      </Combobox>
+    );
+    expect(screen.getByLabelText('Fruit')).toBe(screen.getByRole('combobox'));
+  });
+});
diff --git a/packages/react/components/combobox/__tests__/data-slots.test.tsx b/packages/react/components/combobox/__tests__/data-slots.test.tsx
index fd6424385..c02d68293 100644
--- a/packages/react/components/combobox/__tests__/data-slots.test.tsx
+++ b/packages/react/components/combobox/__tests__/data-slots.test.tsx
@@ -32,14 +32,14 @@ describe('Combobox data-slot contract', () => {
     expect(getSlot(container, 'combobox-input')).not.toBeNull();
   });
 
-  it('exposes content, list, group, label, separator and item slots when open', async () => {
+  it('exposes content, list, group, group label, separator and item slots when open', async () => {
     const user = userEvent.setup();
     render(
       <Combobox>
         <Combobox.Input placeholder='Enter a fruit' />
         <Combobox.Content>
           <Combobox.Group>
-            <Combobox.Label>Fruits</Combobox.Label>
+            <Combobox.GroupLabel>Fruits</Combobox.GroupLabel>
             {FRUIT_OPTIONS.map(option => (
               <Combobox.Item key={option.value} value={option.value}>
                 {option.label}
@@ -64,10 +64,12 @@ describe('Combobox data-slot contract', () => {
       'combobox-content',
       'combobox-list',
       'combobox-group',
-      'combobox-label',
+      'combobox-group-label',
       'combobox-separator',
       'combobox-item',
-      'combobox-item-text'
+      'combobox-item-text',
+      'combobox-status',
+      'combobox-empty'
     ]);
   });
 
@@ -90,4 +92,30 @@ describe('Combobox data-slot contract', () => {
       expect(getSlot(document.body, 'combobox-item-icon')).not.toBeNull();
     });
   });
+
+  it('exposes the label, clear and chip slots in multiple mode', () => {
+    const { container } = render(
+      <Combobox multiple defaultValue={['apple', 'banana', 'cherry']}>
+        <Combobox.Label>Fruits</Combobox.Label>
+        <Combobox.Input placeholder='Enter a fruit' />
+        <Combobox.Clear />
+        <Combobox.Content>
+          {FRUIT_OPTIONS.map(option => (
+            <Combobox.Item key={option.value} value={option.value}>
+              {option.label}
+            </Combobox.Item>
+          ))}
+        </Combobox.Content>
+      </Combobox>
+    );
+    expectSlots(container, [
+      'combobox-label',
+      'combobox-input',
+      'combobox-clear',
+      'combobox-chips',
+      'combobox-chip',
+      'combobox-chip-remove',
+      'combobox-chip-overflow'
+    ]);
+  });
 });
diff --git a/packages/react/components/combobox/combobox-content.tsx b/packages/react/components/combobox/combobox-content.tsx
index 83cce3a7a..08b65a68d 100644
--- a/packages/react/components/combobox/combobox-content.tsx
+++ b/packages/react/components/combobox/combobox-content.tsx
@@ -2,10 +2,11 @@
 
 import { Combobox as ComboboxPrimitive } from '@base-ui/react';
 import { cx } from 'class-variance-authority';
-import type { ReactNode } from 'react';
+import { Children, isValidElement, type ReactNode } from 'react';
 import { type Radius, radiusStyle } from '../../shared/radius';
 import { useThemeInjection } from '../theme/portal';
 import styles from './combobox.module.css';
+import { ComboboxEmpty, ComboboxStatus } from './combobox-misc';
 import { useComboboxContext } from './combobox-root';
 
 export interface ComboboxContentProps<Item = unknown>
@@ -36,6 +37,21 @@ export const ComboboxContent = <Item,>({
 }: ComboboxContentProps<Item>) => {
   const { inputContainerRef } = useComboboxContext();
   const theme = useThemeInjection();
+
+  // Empty and Status are live regions. They sit outside the listbox, so they
+  // are taken out of the children and rendered before the list.
+  let empty: ReactNode = <ComboboxEmpty />;
+  let status: ReactNode = <ComboboxStatus />;
+  let listChildren = children;
+  if (typeof children !== 'function') {
+    listChildren = Children.toArray(children).filter(child => {
+      if (!isValidElement(child)) return true;
+      if (child.type === ComboboxEmpty) empty = child;
+      else if (child.type === ComboboxStatus) status = child;
+      else return true;
+      return false;
+    });
+  }
   return (
     <ComboboxPrimitive.Portal {...theme}>
       <ComboboxPrimitive.Positioner
@@ -60,11 +76,13 @@ export const ComboboxContent = <Item,>({
           finalFocus={finalFocus}
           data-slot='combobox-content'
         >
+          {status}
+          {empty}
           <ComboboxPrimitive.List
             className={styles.list}
             data-slot='combobox-list'
           >
-            {children}
+            {listChildren}
           </ComboboxPrimitive.List>
         </ComboboxPrimitive.Popup>
       </ComboboxPrimitive.Positioner>
diff --git a/packages/react/components/combobox/combobox-input.tsx b/packages/react/components/combobox/combobox-input.tsx
index a8399ef4c..c1b7d2f87 100644
--- a/packages/react/components/combobox/combobox-input.tsx
+++ b/packages/react/components/combobox/combobox-input.tsx
@@ -1,11 +1,18 @@
 'use client';
 
 import { Combobox as ComboboxPrimitive } from '@base-ui/react';
+import { cx } from 'class-variance-authority';
 import { type ComponentProps } from 'react';
-import { ChevronDownIcon } from '~/icons';
+import { ChevronDownIcon, XIcon } from '~/icons';
+import chipStyles from '../chip/chip.module.css';
 import { Input } from '../input';
+import { InputFrame, inputFieldClassName } from '../input/input';
+import inputStyles from '../input/input.module.css';
+import styles from './combobox.module.css';
 import { useComboboxContext } from './combobox-root';
 
+const MAX_CHIPS_VISIBLE = 2;
+
 export interface ComboboxInputProps
   extends Omit<
     ComponentProps<typeof Input>,
@@ -13,23 +20,16 @@ export interface ComboboxInputProps
   > {}
 
 export const ComboboxInput = ({ ref, ...props }: ComboboxInputProps) => {
-  const { multiple, inputContainerRef, value, onValueChange, getLabel } =
-    useComboboxContext();
+  const { multiple, inputContainerRef } = useComboboxContext();
+
+  if (multiple) return <ComboboxChipsInput ref={ref} {...props} />;
+
   return (
     <ComboboxPrimitive.Input
       ref={ref}
       render={
         <Input
           containerRef={inputContainerRef}
-          chips={
-            multiple && Array.isArray(value)
-              ? value.map(val => ({
-                  label: getLabel(val),
-                  onRemove: () =>
-                    onValueChange?.((value as string[])?.filter(v => v !== val))
-                }))
-              : undefined
-          }
           trailingIcon={<ChevronDownIcon />}
           data-slot='combobox-input'
           {...props}
@@ -39,3 +39,115 @@ export const ComboboxInput = ({ ref, ...props }: ComboboxInputProps) => {
   );
 };
 ComboboxInput.displayName = 'Combobox.Input';
+
+const chipClassName = cx(
+  chipStyles.chip,
+  chipStyles['chip-variant-outline'],
+  chipStyles['chip-size-small'],
+  chipStyles['chip-color-neutral'],
+  inputStyles.chip,
+  styles.chip
+);
+
+function ComboboxChipsInput({
+  ref,
+  className,
+  disabled,
+  placeholder,
+  leadingIcon,
+  prefix,
+  size,
+  radius,
+  variant = 'default',
+  classNames,
+  onKeyDown,
+  ...props
+}: ComboboxInputProps) {
+  const { inputContainerRef, value, onValueChange, getLabel } =
+    useComboboxContext();
+  const values = Array.isArray(value) ? value : [];
+  const visibleValues = values.slice(0, MAX_CHIPS_VISIBLE);
+  const hiddenCount = values.length - visibleValues.length;
+  const trailingIcon = <ChevronDownIcon />;
+
+  return (
+    <InputFrame
+      disabled={disabled}
+      hasChips={values.length > 0}
+      leadingIcon={leadingIcon}
+      trailingIcon={trailingIcon}
+      prefix={prefix}
+      size={size}
+      radius={radius}
+      variant={variant}
+      containerRef={inputContainerRef}
+      className={classNames?.container}
+    >
+      <ComboboxPrimitive.Chips
+        className={inputStyles['chip-input-container']}
+        data-slot='combobox-chips'
+      >
+        {visibleValues.map(val => {
+          const label = getLabel(val);
+          return (
+            <ComboboxPrimitive.Chip
+              key={String(val)}
+              className={chipClassName}
+              aria-label={label}
+              data-slot='combobox-chip'
+            >
+              {label}
+              {!disabled && (
+                <ComboboxPrimitive.ChipRemove
+                  className={chipStyles['dismiss-button']}
+                  aria-label={`Remove ${label}`}
+                  data-slot='combobox-chip-remove'
+                >
+                  <XIcon width={12} height={12} aria-hidden='true' />
+                </ComboboxPrimitive.ChipRemove>
+              )}
+            </ComboboxPrimitive.Chip>
+          );
+        })}
+        {hiddenCount > 0 && (
+          <span
+            className={inputStyles['chip-overflow']}
+            data-slot='combobox-chip-overflow'
+          >
+            +{hiddenCount}
+          </span>
+        )}
+        <ComboboxPrimitive.Input
+          ref={ref}
+          className={state =>
+            inputFieldClassName({
+              leadingIcon,
+              trailingIcon,
+              prefix,
+              className:
+                typeof className === 'function' ? className(state) : className
+            })
+          }
+          placeholder={values.length > 0 ? undefined : placeholder}
+          disabled={disabled}
+          data-slot='combobox-input'
+          onKeyDown={event => {
+            onKeyDown?.(event);
+            // Base UI removes the last rendered chip on Backspace. When chips
+            // are hidden behind "+N", that is not the last value.
+            if (
+              event.key === 'Backspace' &&
+              hiddenCount > 0 &&
+              event.currentTarget.value === '' &&
+              !event.baseUIHandlerPrevented
+            ) {
+              event.preventBaseUIHandler();
+              onValueChange?.(values.slice(0, -1));
+            }
+          }}
+          {...props}
+        />
+      </ComboboxPrimitive.Chips>
+    </InputFrame>
+  );
+}
diff --git a/packages/react/components/combobox/combobox-item.tsx b/packages/react/components/combobox/combobox-item.tsx
index 7403a0bda..d558de8e4 100644
--- a/packages/react/components/combobox/combobox-item.tsx
+++ b/packages/react/components/combobox/combobox-item.tsx
@@ -1,6 +1,7 @@
 'use client';
 
 import { Combobox as ComboboxPrimitive } from '@base-ui/react';
+import { useIsoLayoutEffect } from '@base-ui/utils/useIsoLayoutEffect';
 import { cx } from 'class-variance-authority';
 import { ReactNode } from 'react';
 import { Checkbox } from '../checkbox';
@@ -28,13 +29,19 @@ export const ComboboxItem = ({
       ? children
       : undefined;
 
-  const { multiple, inputValue, hasItems } = useComboboxContext();
+  const { multiple, inputValue, hasItems, registerMatch } =
+    useComboboxContext();
 
   // When items prop is not provided on Root, use custom filtering
-  if (!hasItems && inputValue?.length) {
-    const isMatched = getMatch(value, children, inputValue);
-    if (!isMatched) return null;
-  }
+  const hidden =
+    !hasItems && !!inputValue?.length && !getMatch(value, children, inputValue);
+
+  useIsoLayoutEffect(() => {
+    if (hasItems || hidden) return;
+    return registerMatch();
+  }, [hasItems, hidden, registerMatch]);
+
+  if (hidden) return null;
 
   const element =
     typeof children === 'string' ? (
diff --git a/packages/react/components/combobox/combobox-misc.tsx b/packages/react/components/combobox/combobox-misc.tsx
index ddcec0652..56bf56860 100644
--- a/packages/react/components/combobox/combobox-misc.tsx
+++ b/packages/react/components/combobox/combobox-misc.tsx
@@ -2,10 +2,22 @@
 
 import { Combobox as ComboboxPrimitive } from '@base-ui/react';
 import { cx } from 'class-variance-authority';
+import { ClearIcon } from '~/icons';
+import { IconButton } from '../icon-button';
+import type { IconButtonProps } from '../icon-button/icon-button';
+import { Label, type LabelProps } from '../label';
 import styles from './combobox.module.css';
-import { useComboboxContext } from './combobox-root';
+import { useComboboxContext, useMatchCount } from './combobox-root';
 
-export const ComboboxLabel = ({
+export type ComboboxLabelProps = Omit<LabelProps, 'htmlFor'>;
+
+export const ComboboxLabel = (props: ComboboxLabelProps) => {
+  const { inputId } = useComboboxContext();
+  return <Label htmlFor={inputId} data-slot='combobox-label' {...props} />;
+};
+ComboboxLabel.displayName = 'Combobox.Label';
+
+export const ComboboxGroupLabel = ({
   className,
   ...props
 }: ComboboxPrimitive.GroupLabel.Props) => {
@@ -14,13 +26,13 @@ export const ComboboxLabel = ({
 
   return (
     <ComboboxPrimitive.GroupLabel
-      className={cx(styles.label, className)}
-      data-slot='combobox-label'
+      className={cx(styles['group-label'], className)}
+      data-slot='combobox-group-label'
       {...props}
     />
   );
 };
-ComboboxLabel.displayName = 'Combobox.Label';
+ComboboxGroupLabel.displayName = 'Combobox.GroupLabel';
 
 export const ComboboxGroup = ({
   className,
@@ -58,3 +70,88 @@ export const ComboboxSeparator = ({
   );
 };
 ComboboxSeparator.displayName = 'Combobox.Separator';
+
+export interface ComboboxClearProps extends ComboboxPrimitive.Clear.Props {
+  /** @default 2 */
+  size?: IconButtonProps['size'];
+}
+
+export const ComboboxClear = ({
+  className,
+  children = <ClearIcon />,
+  size = 2,
+  'aria-label': ariaLabel = 'Clear',
+  ...props
+}: ComboboxClearProps) => (
+  <ComboboxPrimitive.Clear
+    render={<IconButton size={size} />}
+    className={cx(styles.clear, className)}
+    aria-label={ariaLabel}
+    data-slot='combobox-clear'
+    {...props}
+  >
+    {children}
+  </ComboboxPrimitive.Clear>
+);
+ComboboxClear.displayName = 'Combobox.Clear';
+
+export const ComboboxEmpty = ({
+  className,
+  children = 'No results',
+  ...props
+}: ComboboxPrimitive.Empty.Props) => {
+  const { hasItems } = useComboboxContext();
+  const matchCount = useMatchCount();
+  // Base UI only knows the filtered list when `items` is set on the root.
+  const showChildren = hasItems || matchCount === 0;
+
+  return (
+    <ComboboxPrimitive.Empty
+      className={cx(styles.empty, className)}
+      data-slot='combobox-empty'
+      {...props}
+    >
+      {showChildren ? children : null}
+    </ComboboxPrimitive.Empty>
+  );
+};
+ComboboxEmpty.displayName = 'Combobox.Empty';
+
+function countLeaves(items: readonly unknown[]) {
+  let count = 0;
+  for (const item of items) {
+    const group =
+      typeof item === 'object' && item !== null && 'items' in item
+        ? item.items
+        : undefined;
+    count += Array.isArray(group) ? group.length : 1;
+  }
+  return count;
+}
+
+export const ComboboxStatus = ({
+  className,
+  children,
+  ...props
+}: ComboboxPrimitive.Status.Props) => {
+  const { inputValue, hasItems } = useComboboxContext();
+  const filteredItems = ComboboxPrimitive.useFilteredItems();
+  const matchCount = useMatchCount();
+  const count = hasItems ? countLeaves(filteredItems) : matchCount;
+  // Combobox.Empty announces the zero case.
+  const message =
+    inputValue && count > 0
+      ? `${count} ${count === 1 ? 'result' : 'results'}`
+      : null;
+
+  return (
+    <ComboboxPrimitive.Status
+      className={cx(styles['visually-hidden'], className)}
+      data-slot='combobox-status'
+      {...props}
+    >
+      {children ?? message}
+    </ComboboxPrimitive.Status>
+  );
+};
+ComboboxStatus.displayName = 'Combobox.Status';
diff --git a/packages/react/components/combobox/combobox-root.tsx b/packages/react/components/combobox/combobox-root.tsx
index 5f27a616d..92ab4a467 100644
--- a/packages/react/components/combobox/combobox-root.tsx
+++ b/packages/react/components/combobox/combobox-root.tsx
@@ -6,6 +6,7 @@ import {
   RefObject,
   useCallback,
   useContext,
+  useId,
   useMemo,
   useRef,
   useState
@@ -16,10 +17,13 @@ interface ComboboxContextValue<Value = string> {
   multiple: boolean;
   inputValue: string;
   hasItems: boolean;
+  inputId: string;
   inputContainerRef: RefObject<HTMLDivElement | null>;
   value: Value | Value[] | null | undefined;
   onValueChange?: (value: Value | Value[] | null) => void;
   getLabel: (value: Value) => string;
+  /** Counts the items that match the input when `items` is not set. */
+  registerMatch: () => () => void;
 }
 
 const ComboboxContext = createContext<
@@ -38,6 +42,11 @@ export const useComboboxContext = <
   return context as ComboboxContextValue<Value>;
 };
 
+const MatchCountContext = createContext(0);
+
+/** Number of rendered items that match the input when `items` is not set. */
+export const useMatchCount = () => useContext(MatchCountContext);
+
 export interface BaseComboboxRootProps<Value, Item = Value>
   extends Omit<
     ComboboxPrimitive.Root.Props<Value, boolean, Item>,
@@ -76,18 +85,30 @@ export const ComboboxRoot = <Value extends unknown | unknown[], Item = Value>({
   items,
   required,
   itemToStringLabel,
+  id: idProp,
   ...props
 }: ComboboxRootProps<Value, Item>) => {
+  const generatedId = useId();
+  const id = idProp ?? generatedId;
   const fieldContext = useFieldContext();
   const resolvedRequired = required ?? fieldContext?.required;
 
   const [inputValue, setInputValue] = useState('');
   const [internalValue, setInternalValue] = useState<
     Value | Value[] | null | undefined
-  >(defaultValue ?? null);
+  >(defaultValue ?? (multiple ? [] : null));
+  const [matchCount, setMatchCount] = useState(0);
   const inputContainerRef = useRef<HTMLDivElement>(null);
 
-  const computedValue = providedValue ?? internalValue;
+  // Base UI is always controlled, so a value set through the context (for
+  // example by removing a chip that is hidden behind "+N") reaches it.
+  const computedValue =
+    providedValue === undefined ? internalValue : providedValue;
+
+  const registerMatch = useCallback(() => {
+    setMatchCount(count => count + 1);
+    return () => setMatchCount(count => count - 1);
+  }, []);
 
   const handleInputValueChange = useCallback(
     (
@@ -137,12 +158,23 @@ export const ComboboxRoot = <Value extends unknown | unknown[], Item = Value>({
       multiple,
       inputValue,
       hasItems: !!items,
+      inputId: id,
       inputContainerRef,
       value: computedValue,
       onValueChange: handleValueChange,
-      getLabel
+      getLabel,
+      registerMatch
     }),
-    [multiple, inputValue, items, computedValue, handleValueChange, getLabel]
+    [
+      multiple,
+      inputValue,
+      items,
+      id,
+      computedValue,
+      handleValueChange,
+      getLabel,
+      registerMatch
+    ]
   );
 
   return (
@@ -153,13 +185,13 @@ export const ComboboxRoot = <Value extends unknown | unknown[], Item = Value>({
         onInputValueChange={handleInputValueChange}
         items={items}
         itemToStringLabel={itemToStringLabel}
-        value={providedValue}
-        defaultValue={defaultValue}
+        value={computedValue}
+        id={id}
         required={resolvedRequired}
         modal
         {...props}
       >
-        {children}
+        <MatchCountContext value={matchCount}>{children}</MatchCountContext>
       </ComboboxPrimitive.Root>
     </ComboboxContext>
   );
diff --git a/packages/react/components/combobox/combobox.module.css b/packages/react/components/combobox/combobox.module.css
index 44640aa08..cca8900b5 100644
--- a/packages/react/components/combobox/combobox.module.css
+++ b/packages/react/components/combobox/combobox.module.css
@@ -82,11 +82,43 @@
   padding: 0;
 }
 
-.content:has(.list:empty) {
+.content:has(.list:empty):has(.empty:empty) {
   border: none;
 }
 
-.label {
+.empty {
+  padding: var(--rs-space-4);
+  color: var(--rs-color-foreground-base-secondary);
+  text-align: center;
+  text-wrap: pretty;
+}
+
+.empty:empty {
+  padding: 0;
+}
+
+.visually-hidden {
+  position: absolute;
+  /* Todo: var does not exist for 1px */
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+.clear {
+  color: var(--rs-color-foreground-base-tertiary);
+}
+
+.clear:hover {
+  color: var(--rs-color-foreground-base-secondary);
+}
+
+.group-label {
   padding: var(--rs-space-2) var(--rs-space-3);
   font-weight: var(--rs-font-weight-medium);
   font-size: var(--rs-font-size-mini);
@@ -98,3 +130,11 @@
   margin: var(--rs-space-2) calc(var(--rs-space-3) * -1);
   background: var(--rs-color-border-base-primary);
 }
+
+.chip:focus {
+  outline: none;
+}
+
+.chip:focus-visible {
+  outline: var(--rs-focus-ring);
+}
diff --git a/packages/react/components/combobox/combobox.tsx b/packages/react/components/combobox/combobox.tsx
index d557fc42f..edeabcb77 100644
--- a/packages/react/components/combobox/combobox.tsx
+++ b/packages/react/components/combobox/combobox.tsx
@@ -3,9 +3,13 @@ import { ComboboxContent } from './combobox-content';
 import { ComboboxInput } from './combobox-input';
 import { ComboboxItem } from './combobox-item';
 import {
+  ComboboxClear,
+  ComboboxEmpty,
   ComboboxGroup,
+  ComboboxGroupLabel,
   ComboboxLabel,
-  ComboboxSeparator
+  ComboboxSeparator,
+  ComboboxStatus
 } from './combobox-misc';
 import { ComboboxRoot } from './combobox-root';
 
@@ -13,8 +17,12 @@ export const Combobox = Object.assign(ComboboxRoot, {
   Input: ComboboxInput,
   Content: ComboboxContent,
   Item: ComboboxItem,
-  Group: ComboboxGroup,
   Label: ComboboxLabel,
+  Clear: ComboboxClear,
+  Empty: ComboboxEmpty,
+  Status: ComboboxStatus,
+  Group: ComboboxGroup,
+  GroupLabel: ComboboxGroupLabel,
   Separator: ComboboxSeparator,
   useFilter: ComboboxPrimitive.useFilter,
   useFilteredItems: ComboboxPrimitive.useFilteredItems,
diff --git a/packages/react/components/combobox/index.ts b/packages/react/components/combobox/index.ts
index 4c880b2d0..e6cb8407c 100644
--- a/packages/react/components/combobox/index.ts
+++ b/packages/react/components/combobox/index.ts
@@ -2,4 +2,8 @@ export { Combobox } from './combobox';
 export type { ComboboxContentProps } from './combobox-content';
 export type { ComboboxInputProps } from './combobox-input';
 export type { ComboboxItemProps } from './combobox-item';
+export type {
+  ComboboxClearProps,
+  ComboboxLabelProps
+} from './combobox-misc';
 export type { ComboboxRootProps as ComboboxProps } from './combobox-root';
diff --git a/packages/react/components/input/input.tsx b/packages/react/components/input/input.tsx
index 2199c9597..5736504f1 100644
--- a/packages/react/components/input/input.tsx
+++ b/packages/react/components/input/input.tsx
@@ -40,33 +40,39 @@ export interface InputProps
   classNames?: { container?: string };
 }
 
-export function Input({
-  className,
+interface InputFrameProps extends VariantProps<typeof inputWrapper> {
+  disabled?: boolean;
+  hasChips?: boolean;
+  leadingIcon?: ReactNode;
+  trailingIcon?: ReactNode;
+  prefix?: string;
+  suffix?: string;
+  containerRef?: RefObject<HTMLDivElement | null>;
+  className?: string;
+  children: ReactNode;
+}
+
+/** The input box around the field. Combobox uses it to place Base UI chips. */
+export function InputFrame({
   disabled,
-  placeholder,
+  hasChips,
   leadingIcon,
   trailingIcon,
   prefix,
   suffix,
-  chips,
-  maxChipsVisible = 2,
   size,
   radius,
-  variant = 'default',
+  variant,
   containerRef,
-  classNames,
-  required,
-  ...props
-}: InputProps) {
-  const fieldContext = useFieldContext();
-  const resolvedRequired = required ?? fieldContext?.required;
-
+  className,
+  children
+}: InputFrameProps) {
   return (
     <div
       className={cx(
         inputWrapper({ size, variant, radius }),
-        chips?.length && styles['has-chips'],
-        classNames?.container
+        hasChips && styles['has-chips'],
+        className
       )}
       data-disabled={disabled || undefined}
       data-slot='input-container'
@@ -86,7 +92,79 @@ export function Input({
           {prefix}
         </div>
       )}
+      {children}
+      {suffix && (
+        <div className={styles.suffix} data-slot='input-suffix'>
+          {suffix}
+        </div>
+      )}
+      {trailingIcon && (
+        <div
+          className={styles['trailing-icon']}
+          aria-hidden='true'
+          data-slot='input-trailing-icon'
+        >
+          {trailingIcon}
+        </div>
+      )}
+    </div>
+  );
+}
 
+export function inputFieldClassName({
+  leadingIcon,
+  trailingIcon,
+  prefix,
+  suffix,
+  className
+}: Pick<InputProps, 'leadingIcon' | 'trailingIcon' | 'prefix' | 'suffix'> & {
+  className?: string;
+}) {
+  return cx(
+    styles['input-field'],
+    leadingIcon && styles['has-leading-icon'],
+    trailingIcon && styles['has-trailing-icon'],
+    prefix && styles['has-prefix'],
+    suffix && styles['has-suffix'],
+    className
+  );
+}
+
+export function Input({
+  className,
+  disabled,
+  placeholder,
+  leadingIcon,
+  trailingIcon,
+  prefix,
+  suffix,
+  chips,
+  maxChipsVisible = 2,
+  size,
+  radius,
+  variant = 'default',
+  containerRef,
+  classNames,
+  required,
+  ...props
+}: InputProps) {
+  const fieldContext = useFieldContext();
+  const resolvedRequired = required ?? fieldContext?.required;
+
+  return (
+    <InputFrame
+      disabled={disabled}
+      hasChips={!!chips?.length}
+      leadingIcon={leadingIcon}
+      trailingIcon={trailingIcon}
+      prefix={prefix}
+      suffix={suffix}
+      size={size}
+      radius={radius}
+      variant={variant}
+      containerRef={containerRef}
+      className={classNames?.container}
+    >
       <div
         className={styles['chip-input-container']}
         data-slot='input-chip-container'
@@ -114,36 +192,23 @@ export function Input({
         )}
         <InputPrimitive
           data-slot='input'
-          className={cx(
-            styles['input-field'],
-            leadingIcon && styles['has-leading-icon'],
-            trailingIcon && styles['has-trailing-icon'],
-            prefix && styles['has-prefix'],
-            suffix && styles['has-suffix'],
-            className
-          )}
+          className={state =>
+            inputFieldClassName({
+              leadingIcon,
+              trailingIcon,
+              prefix,
+              suffix,
+              className:
+                typeof className === 'function' ? className(state) : className
+            })
+          }
           placeholder={chips?.length ? undefined : placeholder}
           disabled={disabled}
           required={resolvedRequired}
           {...props}
         />
       </div>
-
-      {suffix && (
-        <div className={styles.suffix} data-slot='input-suffix'>
-          {suffix}
-        </div>
-      )}
-      {trailingIcon && (
-        <div
-          className={styles['trailing-icon']}
-          aria-hidden='true'
-          data-slot='input-trailing-icon'
-        >
-          {trailingIcon}
-        </div>
-      )}
-    </div>
+    </InputFrame>
   );
 }
 
diff --git a/packages/react/index.tsx b/packages/react/index.tsx
index fe8d40934..984b19e9f 100644
--- a/packages/react/index.tsx
+++ b/packages/react/index.tsx
@@ -130,9 +130,11 @@ export { Collapsible } from './components/collapsible';
 export * from './components/color-picker';
 export {
   Combobox,
+  type ComboboxClearProps,
   type ComboboxContentProps,
   type ComboboxInputProps,
   type ComboboxItemProps,
+  type ComboboxLabelProps,
   type ComboboxProps
 } from './components/combobox';
 export {