diff --git a/packages/examples/packages/interactive-ui/snap.manifest.json b/packages/examples/packages/interactive-ui/snap.manifest.json
index b0e030f155..85f5650a38 100644
--- a/packages/examples/packages/interactive-ui/snap.manifest.json
+++ b/packages/examples/packages/interactive-ui/snap.manifest.json
@@ -7,7 +7,7 @@
     "url": "https://github.com/MetaMask/snaps.git"
   },
   "source": {
-    "shasum": "lQJxp8tdELhy1AOIMHwlI4P9XDuQk/HGd6sRn17aHAs=",
+    "shasum": "IN9G5gIS/Du5i6iLckWggkisIlE0A7w6QzvlGyB7Z38=",
     "location": {
       "npm": {
         "filePath": "dist/bundle.js",
diff --git a/packages/examples/packages/interactive-ui/src/components/InteractiveForm.tsx b/packages/examples/packages/interactive-ui/src/components/InteractiveForm.tsx
index aa4b75f67c..98fc01a308 100644
--- a/packages/examples/packages/interactive-ui/src/components/InteractiveForm.tsx
+++ b/packages/examples/packages/interactive-ui/src/components/InteractiveForm.tsx
@@ -16,6 +16,7 @@ import {
   Checkbox,
   Container,
   Footer,
+  DateTimePicker,
 } from '@metamask/snaps-sdk/jsx';
 
 /**
@@ -46,6 +47,21 @@ export type InteractiveFormState = {
    * The value of the example Selector.
    */
   'example-selector': string;
+
+  /**
+   * The value of the example DateTimePicker.
+   */
+  'example-datetime'?: string;
+
+  /**
+   * The value of the example DatePicker.
+   */
+  'example-date'?: string;
+
+  /**
+   * The value of the example TimePicker.
+   */
+  'example-time'?: string;
 };
 
 export const InteractiveForm: SnapComponent<{ disabled?: boolean }> = ({
@@ -102,6 +118,31 @@ export const InteractiveForm: SnapComponent<{ disabled?: boolean }> = ({
               </SelectorOption>
             </Selector>
           </Field>
+          <Field label="Example DateTimePicker">
+            <DateTimePicker
+              name="example-datetime"
+              placeholder="Select a date and time"
+              disabled={disabled}
+            />
+          </Field>
+          <Field label="Example DatePicker">
+            <DateTimePicker
+              name="example-date"
+              type="date"
+              placeholder="Select a date"
+              disableFuture={true}
+              disabled={disabled}
+            />
+          </Field>
+          <Field label="Example TimePicker">
+            <DateTimePicker
+              name="example-time"
+              type="time"
+              placeholder="Select a time"
+              disablePast={true}
+              disabled={disabled}
+            />
+          </Field>
         </Form>
       </Box>
       <Footer>
diff --git a/packages/examples/packages/interactive-ui/src/index.test.tsx b/packages/examples/packages/interactive-ui/src/index.test.tsx
index 6906e2bfab..f7f8f8750f 100644
--- a/packages/examples/packages/interactive-ui/src/index.test.tsx
+++ b/packages/examples/packages/interactive-ui/src/index.test.tsx
@@ -35,6 +35,14 @@ describe('onRpcRequest', () => {
         method: 'dialog',
       });
 
+      const presentDate = new Date();
+
+      const futureDate = new Date();
+      futureDate.setFullYear(futureDate.getFullYear() + 1);
+
+      const pastDate = new Date();
+      pastDate.setFullYear(pastDate.getFullYear() - 1);
+
       const formScreen = await response.getInterface();
 
       expect(formScreen).toRender(<InteractiveForm />);
@@ -49,6 +57,12 @@ describe('onRpcRequest', () => {
 
       await formScreen.clickElement('example-checkbox');
 
+      await formScreen.pickDateTime('example-datetime', presentDate);
+
+      await formScreen.pickDateTime('example-date', pastDate);
+
+      await formScreen.pickDateTime('example-time', futureDate);
+
       await formScreen.clickElement('submit');
 
       const resultScreen = await response.getInterface();
@@ -62,6 +76,9 @@ describe('onRpcRequest', () => {
             'example-radiogroup': 'option3',
             'example-checkbox': true,
             'example-selector': 'option2',
+            'example-datetime': presentDate.toISOString(),
+            'example-date': pastDate.toISOString(),
+            'example-time': futureDate.toISOString(),
           }}
         />,
       );
@@ -94,6 +111,9 @@ describe('onRpcRequest', () => {
             'example-radiogroup': 'option1',
             'example-checkbox': false,
             'example-selector': 'option1',
+            'example-datetime': '',
+            'example-date': '',
+            'example-time': '',
           }}
         />,
       );
@@ -106,6 +126,14 @@ describe('onRpcRequest', () => {
 
 describe('onHomePage', () => {
   it('returns custom UI', async () => {
+    const presentDate = new Date();
+
+    const futureDate = new Date();
+    futureDate.setFullYear(futureDate.getFullYear() + 1);
+
+    const pastDate = new Date();
+    pastDate.setFullYear(pastDate.getFullYear() - 1);
+
     const { onHomePage } = await installSnap();
 
     const response = await onHomePage();
@@ -122,6 +150,12 @@ describe('onHomePage', () => {
 
     await formScreen.selectFromSelector('example-selector', 'option2');
 
+    await formScreen.pickDateTime('example-datetime', presentDate);
+
+    await formScreen.pickDateTime('example-date', pastDate);
+
+    await formScreen.pickDateTime('example-time', futureDate);
+
     await formScreen.clickElement('submit');
 
     const resultScreen = response.getInterface();
@@ -134,6 +168,9 @@ describe('onHomePage', () => {
           'example-radiogroup': 'option3',
           'example-checkbox': false,
           'example-selector': 'option2',
+          'example-datetime': presentDate.toISOString(),
+          'example-date': pastDate.toISOString(),
+          'example-time': futureDate.toISOString(),
         }}
       />,
     );
diff --git a/packages/snaps-controllers/src/interface/utils.test.tsx b/packages/snaps-controllers/src/interface/utils.test.tsx
index 159c4bbfb5..b211b899ef 100644
--- a/packages/snaps-controllers/src/interface/utils.test.tsx
+++ b/packages/snaps-controllers/src/interface/utils.test.tsx
@@ -18,6 +18,7 @@ import {
   AssetSelector,
   AddressInput,
   AccountSelector,
+  DateTimePicker,
 } from '@metamask/snaps-sdk/jsx';
 import type { CaipAccountId } from '@metamask/utils';
 import { parseCaipAccountId } from '@metamask/utils';
@@ -352,6 +353,66 @@ describe('constructState', () => {
     });
   });
 
+  it('sets default value for root level DateTimePicker', () => {
+    const element = (
+      <Box>
+        <DateTimePicker name="foo" />
+      </Box>
+    );
+
+    const result = constructState({}, element, elementDataGetters);
+    expect(result).toStrictEqual({
+      foo: null,
+    });
+  });
+
+  it('supports root level DateTimePicker', () => {
+    const element = (
+      <Box>
+        <DateTimePicker name="foo" value="2022-01-01T00:00:00Z" />
+      </Box>
+    );
+
+    const result = constructState({}, element, elementDataGetters);
+    expect(result).toStrictEqual({
+      foo: '2022-01-01T00:00:00Z',
+    });
+  });
+
+  it('sets default value for DateTimePicker in forms', () => {
+    const element = (
+      <Box>
+        <Form name="form">
+          <Field label="foo">
+            <DateTimePicker name="foo" />
+          </Field>
+        </Form>
+      </Box>
+    );
+
+    const result = constructState({}, element, elementDataGetters);
+    expect(result).toStrictEqual({
+      form: { foo: null },
+    });
+  });
+
+  it('supports DateTimePicker in forms', () => {
+    const element = (
+      <Box>
+        <Form name="form">
+          <Field label="foo">
+            <DateTimePicker name="foo" value="2022-01-01T00:00:00Z" />
+          </Field>
+        </Form>
+      </Box>
+    );
+
+    const result = constructState({}, element, elementDataGetters);
+    expect(result).toStrictEqual({
+      form: { foo: '2022-01-01T00:00:00Z' },
+    });
+  });
+
   it('sets default value for root level dropdown', () => {
     const element = (
       <Box>
diff --git a/packages/snaps-controllers/src/interface/utils.ts b/packages/snaps-controllers/src/interface/utils.ts
index 73d555fc45..e2c95928e1 100644
--- a/packages/snaps-controllers/src/interface/utils.ts
+++ b/packages/snaps-controllers/src/interface/utils.ts
@@ -23,6 +23,7 @@ import type {
   AssetSelectorElement,
   AddressInputElement,
   AccountSelectorElement,
+  DateTimePickerElement,
 } from '@metamask/snaps-sdk/jsx';
 import { isJSXElementUnsafe } from '@metamask/snaps-sdk/jsx';
 import type { InternalAccount } from '@metamask/snaps-utils';
@@ -57,6 +58,7 @@ const STATEFUL_COMPONENT_TYPES = [
   'AssetSelector',
   'AddressInput',
   'AccountSelector',
+  'DateTimePicker',
 ] as const;
 
 /**
@@ -342,7 +344,8 @@ function constructComponentSpecificDefaultState(
     | SelectorElement
     | AssetSelectorElement
     | AddressInputElement
-    | AccountSelectorElement,
+    | AccountSelectorElement
+    | DateTimePickerElement,
   elementDataGetters: ElementDataGetters,
 ) {
   switch (element.type) {
@@ -459,7 +462,8 @@ function getComponentStateValue(
     | SelectorElement
     | AssetSelectorElement
     | AddressInputElement
-    | AccountSelectorElement,
+    | AccountSelectorElement
+    | DateTimePickerElement,
   elementDataGetters: ElementDataGetters,
 ) {
   switch (element.type) {
@@ -510,7 +514,8 @@ function constructInputState(
     | SelectorElement
     | AssetSelectorElement
     | AddressInputElement
-    | AccountSelectorElement,
+    | AccountSelectorElement
+    | DateTimePickerElement,
   elementDataGetters: ElementDataGetters,
   form?: string,
 ) {
diff --git a/packages/snaps-execution-environments/lavamoat/webpack/iframe/policy.json b/packages/snaps-execution-environments/lavamoat/webpack/iframe/policy.json
index 77ed929d08..03edb96300 100644
--- a/packages/snaps-execution-environments/lavamoat/webpack/iframe/policy.json
+++ b/packages/snaps-execution-environments/lavamoat/webpack/iframe/policy.json
@@ -74,7 +74,8 @@
     "@metamask/snaps-sdk": {
       "packages": {
         "@metamask/superstruct": true,
-        "@metamask/utils": true
+        "@metamask/utils": true,
+        "@metamask/snaps-sdk>luxon": true
       }
     },
     "@metamask/snaps-utils": {
@@ -143,6 +144,11 @@
         "define": true
       }
     },
+    "@metamask/snaps-sdk>luxon": {
+      "globals": {
+        "Intl": true
+      }
+    },
     "@metamask/object-multiplex>once": {
       "packages": {
         "@metamask/object-multiplex>once>wrappy": true
diff --git a/packages/snaps-execution-environments/lavamoat/webpack/node-process/policy.json b/packages/snaps-execution-environments/lavamoat/webpack/node-process/policy.json
index f54f8cf330..984466b8b9 100644
--- a/packages/snaps-execution-environments/lavamoat/webpack/node-process/policy.json
+++ b/packages/snaps-execution-environments/lavamoat/webpack/node-process/policy.json
@@ -81,7 +81,8 @@
     "@metamask/snaps-sdk": {
       "packages": {
         "@metamask/superstruct": true,
-        "@metamask/utils": true
+        "@metamask/utils": true,
+        "@metamask/snaps-sdk>luxon": true
       }
     },
     "@metamask/snaps-utils": {
@@ -156,6 +157,11 @@
         "define": true
       }
     },
+    "@metamask/snaps-sdk>luxon": {
+      "globals": {
+        "Intl": true
+      }
+    },
     "@metamask/object-multiplex>once": {
       "packages": {
         "@metamask/object-multiplex>once>wrappy": true
diff --git a/packages/snaps-execution-environments/lavamoat/webpack/node-thread/policy.json b/packages/snaps-execution-environments/lavamoat/webpack/node-thread/policy.json
index f54f8cf330..984466b8b9 100644
--- a/packages/snaps-execution-environments/lavamoat/webpack/node-thread/policy.json
+++ b/packages/snaps-execution-environments/lavamoat/webpack/node-thread/policy.json
@@ -81,7 +81,8 @@
     "@metamask/snaps-sdk": {
       "packages": {
         "@metamask/superstruct": true,
-        "@metamask/utils": true
+        "@metamask/utils": true,
+        "@metamask/snaps-sdk>luxon": true
       }
     },
     "@metamask/snaps-utils": {
@@ -156,6 +157,11 @@
         "define": true
       }
     },
+    "@metamask/snaps-sdk>luxon": {
+      "globals": {
+        "Intl": true
+      }
+    },
     "@metamask/object-multiplex>once": {
       "packages": {
         "@metamask/object-multiplex>once>wrappy": true
diff --git a/packages/snaps-execution-environments/lavamoat/webpack/webview/policy.json b/packages/snaps-execution-environments/lavamoat/webpack/webview/policy.json
index 77ed929d08..03edb96300 100644
--- a/packages/snaps-execution-environments/lavamoat/webpack/webview/policy.json
+++ b/packages/snaps-execution-environments/lavamoat/webpack/webview/policy.json
@@ -74,7 +74,8 @@
     "@metamask/snaps-sdk": {
       "packages": {
         "@metamask/superstruct": true,
-        "@metamask/utils": true
+        "@metamask/utils": true,
+        "@metamask/snaps-sdk>luxon": true
       }
     },
     "@metamask/snaps-utils": {
@@ -143,6 +144,11 @@
         "define": true
       }
     },
+    "@metamask/snaps-sdk>luxon": {
+      "globals": {
+        "Intl": true
+      }
+    },
     "@metamask/object-multiplex>once": {
       "packages": {
         "@metamask/object-multiplex>once>wrappy": true
diff --git a/packages/snaps-jest/src/helpers.test.tsx b/packages/snaps-jest/src/helpers.test.tsx
index 5c4a81739b..33c2df8a46 100644
--- a/packages/snaps-jest/src/helpers.test.tsx
+++ b/packages/snaps-jest/src/helpers.test.tsx
@@ -411,6 +411,7 @@ describe('installSnap', () => {
         type: DialogType.Prompt,
         content: <Text>Hello, world!</Text>,
         clickElement: expect.any(Function),
+        pickDateTime: expect.any(Function),
         typeInField: expect.any(Function),
         selectInDropdown: expect.any(Function),
         selectFromRadioGroup: expect.any(Function),
@@ -475,6 +476,7 @@ describe('installSnap', () => {
         type: DialogType.Confirmation,
         content: <Text>Hello, world!</Text>,
         clickElement: expect.any(Function),
+        pickDateTime: expect.any(Function),
         typeInField: expect.any(Function),
         selectInDropdown: expect.any(Function),
         selectFromRadioGroup: expect.any(Function),
@@ -539,6 +541,7 @@ describe('installSnap', () => {
         type: DialogType.Alert,
         content: <Text>Hello, world!</Text>,
         clickElement: expect.any(Function),
+        pickDateTime: expect.any(Function),
         typeInField: expect.any(Function),
         selectInDropdown: expect.any(Function),
         selectFromRadioGroup: expect.any(Function),
diff --git a/packages/snaps-jest/src/test-utils/response.ts b/packages/snaps-jest/src/test-utils/response.ts
index fb19b82725..f40ef6217d 100644
--- a/packages/snaps-jest/src/test-utils/response.ts
+++ b/packages/snaps-jest/src/test-utils/response.ts
@@ -57,6 +57,7 @@ export function getMockInterfaceResponse(
   return {
     content,
     clickElement: jest.fn(),
+    pickDateTime: jest.fn(),
     typeInField: jest.fn(),
     selectInDropdown: jest.fn(),
     selectFromRadioGroup: jest.fn(),
diff --git a/packages/snaps-rpc-methods/src/permitted/createInterface.test.tsx b/packages/snaps-rpc-methods/src/permitted/createInterface.test.tsx
index 7a36ba062a..96cb78c886 100644
--- a/packages/snaps-rpc-methods/src/permitted/createInterface.test.tsx
+++ b/packages/snaps-rpc-methods/src/permitted/createInterface.test.tsx
@@ -141,7 +141,7 @@ describe('snap_createInterface', () => {
       error: {
         code: -32602,
         message:
-          'Invalid params: At path: ui -- Expected type to be one of: "AccountSelector", "Address", "AssetSelector", "AddressInput", "Bold", "Box", "Button", "Copyable", "Divider", "Dropdown", "RadioGroup", "Field", "FileInput", "Form", "Heading", "Input", "Image", "Italic", "Link", "Row", "Spinner", "Text", "Tooltip", "Checkbox", "Card", "Icon", "Selector", "Section", "Avatar", "Banner", "Skeleton", "Container", but received: undefined.',
+          'Invalid params: At path: ui -- Expected type to be one of: "AccountSelector", "Address", "AssetSelector", "AddressInput", "Bold", "Box", "Button", "Copyable", "DateTimePicker", "Divider", "Dropdown", "RadioGroup", "Field", "FileInput", "Form", "Heading", "Input", "Image", "Italic", "Link", "Row", "Spinner", "Text", "Tooltip", "Checkbox", "Card", "Icon", "Selector", "Section", "Avatar", "Banner", "Skeleton", "Container", but received: undefined.',
         stack: expect.any(String),
       },
       id: 1,
@@ -191,7 +191,7 @@ describe('snap_createInterface', () => {
       error: {
         code: -32602,
         message:
-          'Invalid params: At path: ui.props.children.props.children -- Expected type to be one of: "AssetSelector", "AddressInput", "AccountSelector", "Input", "Dropdown", "RadioGroup", "FileInput", "Checkbox", "Selector", but received: "Copyable".',
+          'Invalid params: At path: ui.props.children.props.children -- Expected type to be one of: "AssetSelector", "AddressInput", "AccountSelector", "Input", "Dropdown", "RadioGroup", "FileInput", "Checkbox", "Selector", "DateTimePicker", but received: "Copyable".',
         stack: expect.any(String),
       },
       id: 1,
diff --git a/packages/snaps-sdk/package.json b/packages/snaps-sdk/package.json
index 50403a6c09..60bd3bf488 100644
--- a/packages/snaps-sdk/package.json
+++ b/packages/snaps-sdk/package.json
@@ -95,13 +95,15 @@
     "@metamask/providers": "^22.1.1",
     "@metamask/rpc-errors": "^7.0.3",
     "@metamask/superstruct": "^3.2.1",
-    "@metamask/utils": "^11.8.1"
+    "@metamask/utils": "^11.8.1",
+    "luxon": "^3.5.0"
   },
   "devDependencies": {
     "@lavamoat/allow-scripts": "^3.4.0",
     "@metamask/auto-changelog": "^5.0.2",
     "@ts-bridge/cli": "^0.6.1",
     "@types/jest": "^27.5.1",
+    "@types/luxon": "^3",
     "deepmerge": "^4.2.2",
     "depcheck": "^1.4.7",
     "eslint": "^9.11.0",
diff --git a/packages/snaps-sdk/src/index.ts b/packages/snaps-sdk/src/index.ts
index 761189b66c..720afd5560 100644
--- a/packages/snaps-sdk/src/index.ts
+++ b/packages/snaps-sdk/src/index.ts
@@ -12,6 +12,7 @@ export {
   typedUnion,
   selectiveUnion,
   nonEmptyRecord,
+  ISO8601DateStruct,
 } from './internals';
 
 // Re-exported from `@metamask/utils` for convenience.
diff --git a/packages/snaps-sdk/src/internals/index.ts b/packages/snaps-sdk/src/internals/index.ts
index bba5a526d7..d11fba8537 100644
--- a/packages/snaps-sdk/src/internals/index.ts
+++ b/packages/snaps-sdk/src/internals/index.ts
@@ -4,3 +4,4 @@ export type * from './helpers';
 export * from './structs';
 export * from './jsx';
 export * from './svg';
+export * from './time';
diff --git a/packages/snaps-sdk/src/internals/time.test.ts b/packages/snaps-sdk/src/internals/time.test.ts
new file mode 100644
index 0000000000..ef02fb107a
--- /dev/null
+++ b/packages/snaps-sdk/src/internals/time.test.ts
@@ -0,0 +1,35 @@
+import { create, is } from '@metamask/superstruct';
+import { DateTime } from 'luxon';
+
+import { ISO8601DateStruct } from './time';
+
+describe('ISO8601DateStruct', () => {
+  it('should return true for a valid ISO 8601 date', () => {
+    const value = DateTime.now().toISO();
+    expect(is(value, ISO8601DateStruct)).toBe(true);
+  });
+
+  it('should return false for an invalid ISO 8601 date', () => {
+    const value = 'Mon Mar 31 2025';
+    expect(is(value, ISO8601DateStruct)).toBe(false);
+  });
+
+  it('should return false for an ISO 8601 date without timezone information', () => {
+    const value = '2025-03-31T12:00:00';
+    expect(is(value, ISO8601DateStruct)).toBe(false);
+  });
+
+  it('should return an error message for invalid ISO 8601 date', () => {
+    const value = 'Mon Mar 31 2025';
+    expect(() => create(value, ISO8601DateStruct)).toThrow(
+      'Not a valid ISO 8601 date',
+    );
+  });
+
+  it('should return an error message for ISO 8601 date without timezone information', () => {
+    const value = '2025-03-31T12:00:00';
+    expect(() => create(value, ISO8601DateStruct)).toThrow(
+      'ISO 8601 date must have timezone information',
+    );
+  });
+});
diff --git a/packages/snaps-sdk/src/internals/time.ts b/packages/snaps-sdk/src/internals/time.ts
new file mode 100644
index 0000000000..8ad76d5c79
--- /dev/null
+++ b/packages/snaps-sdk/src/internals/time.ts
@@ -0,0 +1,25 @@
+import { refine, string } from '@metamask/superstruct';
+import { DateTime } from 'luxon';
+
+/**
+ * Regex to match the offset part of an ISO 8601 date.
+ */
+const offsetRegex = /Z|([+-]\d{2}:?\d{2})$/u;
+
+/**
+ * Refines a string as an ISO 8601 date.
+ */
+export const ISO8601DateStruct = refine(string(), 'ISO 8601 date', (value) => {
+  const parsedDate = DateTime.fromISO(value);
+
+  if (!parsedDate.isValid) {
+    return 'Not a valid ISO 8601 date';
+  }
+
+  if (!offsetRegex.test(value)) {
+    // Luxon doesn't have a reliable way to check if timezone info was not provided
+    return 'ISO 8601 date must have timezone information';
+  }
+
+  return true;
+});
diff --git a/packages/snaps-sdk/src/jsx/components/form/DateTimePicker.test.tsx b/packages/snaps-sdk/src/jsx/components/form/DateTimePicker.test.tsx
new file mode 100644
index 0000000000..b8976c2fc5
--- /dev/null
+++ b/packages/snaps-sdk/src/jsx/components/form/DateTimePicker.test.tsx
@@ -0,0 +1,70 @@
+import { DateTimePicker } from './DateTimePicker';
+
+describe('DateTimePicker', () => {
+  it('renders a date picker', () => {
+    const element = <DateTimePicker name="test" type="date" />;
+
+    expect(element).toStrictEqual({
+      type: 'DateTimePicker',
+      props: {
+        name: 'test',
+        type: 'date',
+      },
+      key: null,
+    });
+  });
+
+  it('renders a time picker', () => {
+    const element = <DateTimePicker name="test" type="time" />;
+
+    expect(element).toStrictEqual({
+      type: 'DateTimePicker',
+      props: {
+        name: 'test',
+        type: 'time',
+      },
+      key: null,
+    });
+  });
+
+  it('renders a date and time picker', () => {
+    const element = <DateTimePicker name="test" type="datetime" />;
+
+    expect(element).toStrictEqual({
+      type: 'DateTimePicker',
+      props: {
+        name: 'test',
+        type: 'datetime',
+      },
+      key: null,
+    });
+  });
+
+  it('renders a date and time picker with optional props', () => {
+    const element = (
+      <DateTimePicker
+        name="test"
+        type="datetime"
+        placeholder="Select date and time"
+        disabled={true}
+        value="2024-01-01T12:00Z"
+        disablePast={false}
+        disableFuture={true}
+      />
+    );
+
+    expect(element).toStrictEqual({
+      type: 'DateTimePicker',
+      props: {
+        name: 'test',
+        type: 'datetime',
+        placeholder: 'Select date and time',
+        disabled: true,
+        value: '2024-01-01T12:00Z',
+        disablePast: false,
+        disableFuture: true,
+      },
+      key: null,
+    });
+  });
+});
diff --git a/packages/snaps-sdk/src/jsx/components/form/DateTimePicker.ts b/packages/snaps-sdk/src/jsx/components/form/DateTimePicker.ts
new file mode 100644
index 0000000000..31a102eafd
--- /dev/null
+++ b/packages/snaps-sdk/src/jsx/components/form/DateTimePicker.ts
@@ -0,0 +1,53 @@
+import { createSnapComponent } from '../../component';
+
+/**
+ * The props of the {@link DateTimePicker} component.
+ *
+ * @property name - The name of the date/time picker field. This is used to identify the
+ * date/time picker field in the form data.
+ * @property value - The value of the date/time picker field. Must be an ISO 8601 date string with
+ * timezone information.
+ * @property type - The type of the date/time picker field. Can be 'date', 'time', or 'datetime'.
+ * Defaults to 'datetime'.
+ * @property placeholder - The placeholder text of the date/time picker field.
+ * @property disabled - Whether the date/time picker field is disabled.
+ * @property disablePast - Whether to allow selection of past dates. Defaults to false.
+ * @property disableFuture - Whether to allow selection of future dates. Defaults to false.
+ */
+export type DateTimePickerProps = {
+  name: string;
+  value?: string | undefined;
+  type?: 'date' | 'time' | 'datetime' | undefined;
+  placeholder?: string | undefined;
+  disabled?: boolean | undefined;
+  disablePast?: boolean | undefined;
+  disableFuture?: boolean | undefined;
+};
+
+const TYPE = 'DateTimePicker';
+
+/**
+ * A date/time picker component, which is used to create a date/time picker field.
+ *
+ * @param props - The props of the component.
+ * @param props.name - The name of the date/time picker field. This is used to identify the
+ * date/time picker field in the form data.
+ * @param props.value - The value of the date/time picker field.
+ * @param props.type - The type of the date/time picker field. Can be 'date', 'time', or 'datetime'.
+ * Defaults to 'datetime'.
+ * @param props.placeholder - The placeholder text of the date/time picker field.
+ * @param props.disabled - Whether the date/time picker field is disabled.
+ * @param props.disablePast - Whether to allow selection of past dates. Defaults to false.
+ * @param props.disableFuture - Whether to allow selection of future dates. Defaults to false.
+ */
+export const DateTimePicker = createSnapComponent<
+  DateTimePickerProps,
+  typeof TYPE
+>(TYPE);
+
+/**
+ * A DateTimePicker element.
+ *
+ * @see DateTimePicker
+ */
+export type DateTimePickerElement = ReturnType<typeof DateTimePicker>;
diff --git a/packages/snaps-sdk/src/jsx/components/form/Field.ts b/packages/snaps-sdk/src/jsx/components/form/Field.ts
index 3da4349a2d..7d9caf33dd 100644
--- a/packages/snaps-sdk/src/jsx/components/form/Field.ts
+++ b/packages/snaps-sdk/src/jsx/components/form/Field.ts
@@ -2,6 +2,7 @@ import type { AccountSelectorElement } from './AccountSelector';
 import type { AddressInputElement } from './AddressInput';
 import type { AssetSelectorElement } from './AssetSelector';
 import type { CheckboxElement } from './Checkbox';
+import type { DateTimePickerElement } from './DateTimePicker';
 import type { DropdownElement } from './Dropdown';
 import type { FileInputElement } from './FileInput';
 import type { InputElement } from './Input';
@@ -25,6 +26,7 @@ export type FieldProps = {
     | [GenericSnapChildren, InputElement]
     | [GenericSnapChildren, InputElement, GenericSnapChildren]
     | DropdownElement
+    | DateTimePickerElement
     | RadioGroupElement
     | FileInputElement
     | InputElement
diff --git a/packages/snaps-sdk/src/jsx/components/form/index.ts b/packages/snaps-sdk/src/jsx/components/form/index.ts
index 6fe932c3b4..ac23d81bcc 100644
--- a/packages/snaps-sdk/src/jsx/components/form/index.ts
+++ b/packages/snaps-sdk/src/jsx/components/form/index.ts
@@ -3,6 +3,7 @@ import type { AddressInputElement } from './AddressInput';
 import type { AssetSelectorElement } from './AssetSelector';
 import type { ButtonElement } from './Button';
 import type { CheckboxElement } from './Checkbox';
+import type { DateTimePickerElement } from './DateTimePicker';
 import type { DropdownElement } from './Dropdown';
 import type { FieldElement } from './Field';
 import type { FileInputElement } from './FileInput';
@@ -19,6 +20,7 @@ export * from './AddressInput';
 export * from './AssetSelector';
 export * from './Button';
 export * from './Checkbox';
+export * from './DateTimePicker';
 export * from './Dropdown';
 export * from './Option';
 export * from './Radio';
@@ -36,6 +38,7 @@ export type StandardFormElement =
   | AssetSelectorElement
   | ButtonElement
   | CheckboxElement
+  | DateTimePickerElement
   | FormElement
   | FieldElement
   | FileInputElement
diff --git a/packages/snaps-sdk/src/jsx/validation.test.tsx b/packages/snaps-sdk/src/jsx/validation.test.tsx
index 5636b60474..e92863d325 100644
--- a/packages/snaps-sdk/src/jsx/validation.test.tsx
+++ b/packages/snaps-sdk/src/jsx/validation.test.tsx
@@ -38,6 +38,7 @@ import {
   AssetSelector,
   AddressInput,
   AccountSelector,
+  DateTimePicker,
 } from './components';
 import {
   AddressStruct,
@@ -80,6 +81,7 @@ import {
   AssetSelectorStruct,
   AddressInputStruct,
   AccountSelectorStruct,
+  DateTimePickerStruct,
 } from './validation';
 
 describe('KeyStruct', () => {
@@ -381,6 +383,9 @@ describe('FieldStruct', () => {
     <Field label="foo">
       <AccountSelector name="account" />
     </Field>,
+    <Field label="foo">
+      <DateTimePicker name="foo" />
+    </Field>,
   ])('validates a field element', (value) => {
     expect(is(value, FieldStruct)).toBe(true);
   });
@@ -1008,6 +1013,57 @@ describe('CopyableStruct', () => {
   });
 });
 
+describe('DateTimePickerStruct', () => {
+  it.each([
+    <DateTimePicker name="foo" />,
+    <DateTimePicker name="foo" type="datetime" />,
+    <DateTimePicker name="foo" type="date" />,
+    <DateTimePicker name="foo" type="time" />,
+    <DateTimePicker name="foo" value={new Date().toISOString()} />,
+    <DateTimePicker name="foo" disabled={true} />,
+    <DateTimePicker name="foo" disablePast={false} />,
+    <DateTimePicker name="foo" disableFuture={true} />,
+    <DateTimePicker
+      name="foo"
+      value={new Date().toISOString()}
+      placeholder="foobar"
+      type="datetime"
+      disabled={true}
+      disablePast={true}
+    />,
+  ])('validates a date time picker element', (value) => {
+    expect(is(value, DateTimePickerStruct)).toBe(true);
+  });
+
+  it.each([
+    'foo',
+    42,
+    null,
+    undefined,
+    {},
+    [],
+    // @ts-expect-error - Invalid props.
+    <DateTimePicker />,
+    // @ts-expect-error - Invalid props.
+    <DateTimePicker name={42} />,
+    // @ts-expect-error - Invalid props.
+    <DateTimePicker name="foo" type="foo" />,
+    // @ts-expect-error - Invalid props.
+    <DateTimePicker name="foo" value={42} />,
+    // @ts-expect-error - Invalid props.
+    <DateTimePicker name="foo" placeholder={32} />,
+    <Text>foo</Text>,
+    <Box>
+      <Text>foo</Text>
+    </Box>,
+    <Row label="label">
+      <Image src="src" alt="alt" />
+    </Row>,
+  ])('does not validate "%p"', (value) => {
+    expect(is(value, DateTimePickerStruct)).toBe(false);
+  });
+});
+
 describe('DividerStruct', () => {
   it.each([<Divider />])('validates a divider element', (value) => {
     expect(is(value, DividerStruct)).toBe(true);
diff --git a/packages/snaps-sdk/src/jsx/validation.ts b/packages/snaps-sdk/src/jsx/validation.ts
index e4ccf4a36e..f1a6a7c988 100644
--- a/packages/snaps-sdk/src/jsx/validation.ts
+++ b/packages/snaps-sdk/src/jsx/validation.ts
@@ -80,6 +80,7 @@ import type {
   SelectorElement,
   SelectorOptionElement,
   BannerElement,
+  DateTimePickerElement,
 } from './components';
 import { IconName } from './components';
 import type { Describe } from '../internals';
@@ -89,6 +90,7 @@ import {
   selectiveUnion,
   svg,
   typedUnion,
+  ISO8601DateStruct,
 } from '../internals';
 import {
   NonEip155AssetTypeStruct,
@@ -380,6 +382,24 @@ export const DropdownStruct: Describe<DropdownElement> = element('Dropdown', {
   disabled: optional(boolean()),
 });
 
+/**
+ * A struct for the {@link DateTimePickerElement} type.
+ */
+export const DateTimePickerStruct: Describe<DateTimePickerElement> = element(
+  'DateTimePicker',
+  {
+    name: string(),
+    type: optional(
+      nullUnion([literal('date'), literal('time'), literal('datetime')]),
+    ),
+    placeholder: optional(string()),
+    disabled: optional(boolean()),
+    disablePast: optional(boolean()),
+    disableFuture: optional(boolean()),
+    value: optional(ISO8601DateStruct),
+  },
+);
+
 /**
  * A struct for the {@link AddressElement} type.
  */
@@ -546,6 +566,7 @@ const FIELD_CHILDREN_ARRAY = [
   FileInputStruct,
   CheckboxStruct,
   SelectorStruct,
+  DateTimePickerStruct,
 ] as [
   typeof AssetSelectorStruct,
   typeof AddressInputStruct,
@@ -556,6 +577,7 @@ const FIELD_CHILDREN_ARRAY = [
   typeof FileInputStruct,
   typeof CheckboxStruct,
   typeof SelectorStruct,
+  typeof DateTimePickerStruct,
 ];
 
 /**
@@ -595,6 +617,7 @@ const FieldChildStruct = selectiveUnion((value) => {
   | InputElement
   | CheckboxElement
   | SelectorElement
+  | DateTimePickerElement
   | AssetSelectorElement
   | AddressInputElement
   | AccountSelectorElement,
@@ -963,6 +986,7 @@ export const BoxChildStruct = typedUnion([
   BoxStruct,
   ButtonStruct,
   CopyableStruct,
+  DateTimePickerStruct,
   DividerStruct,
   DropdownStruct,
   RadioGroupStruct,
@@ -1035,6 +1059,7 @@ export const JSXElementStruct: Describe<JSXElement> = typedUnion([
   AddressStruct,
   BoxStruct,
   CopyableStruct,
+  DateTimePickerStruct,
   DividerStruct,
   HeadingStruct,
   ImageStruct,
diff --git a/packages/snaps-simulation/src/helpers.test.tsx b/packages/snaps-simulation/src/helpers.test.tsx
index ffd8f259cf..f4098263fe 100644
--- a/packages/snaps-simulation/src/helpers.test.tsx
+++ b/packages/snaps-simulation/src/helpers.test.tsx
@@ -140,6 +140,7 @@ describe('helpers', () => {
         type: DialogType.Prompt,
         content: <Text>Hello, world!</Text>,
         clickElement: expect.any(Function),
+        pickDateTime: expect.any(Function),
         typeInField: expect.any(Function),
         selectInDropdown: expect.any(Function),
         selectFromRadioGroup: expect.any(Function),
@@ -204,6 +205,7 @@ describe('helpers', () => {
         type: DialogType.Confirmation,
         content: <Text>Hello, world!</Text>,
         clickElement: expect.any(Function),
+        pickDateTime: expect.any(Function),
         typeInField: expect.any(Function),
         selectInDropdown: expect.any(Function),
         selectFromRadioGroup: expect.any(Function),
@@ -268,6 +270,7 @@ describe('helpers', () => {
         type: DialogType.Alert,
         content: <Text>Hello, world!</Text>,
         clickElement: expect.any(Function),
+        pickDateTime: expect.any(Function),
         typeInField: expect.any(Function),
         selectInDropdown: expect.any(Function),
         selectFromRadioGroup: expect.any(Function),
diff --git a/packages/snaps-simulation/src/interface.test.tsx b/packages/snaps-simulation/src/interface.test.tsx
index 0d7e9abf62..1bce0951c0 100644
--- a/packages/snaps-simulation/src/interface.test.tsx
+++ b/packages/snaps-simulation/src/interface.test.tsx
@@ -31,6 +31,7 @@ import {
   Field,
   AccountSelector,
   AssetSelector,
+  DateTimePicker,
 } from '@metamask/snaps-sdk/jsx';
 import {
   getJsxElementFromComponent,
@@ -55,6 +56,7 @@ import {
   selectFromSelector,
   waitForUpdate,
   getValueFromSelector,
+  pickDateTime,
 } from './interface';
 import type { RunSagaFunction } from './store';
 import { createStore, resolveInterface, setInterface } from './store';
@@ -90,6 +92,7 @@ async function getResolve(runSaga: RunSagaFunction) {
 describe('getInterfaceResponse', () => {
   const interfaceActions = {
     clickElement: jest.fn(),
+    pickDateTime: jest.fn(),
     typeInField: jest.fn(),
     selectInDropdown: jest.fn(),
     selectFromRadioGroup: jest.fn(),
@@ -114,6 +117,7 @@ describe('getInterfaceResponse', () => {
       id: 'foo',
       content: <Text>foo</Text>,
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -144,6 +148,7 @@ describe('getInterfaceResponse', () => {
       id: 'foo',
       content: <Text>foo</Text>,
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -175,6 +180,7 @@ describe('getInterfaceResponse', () => {
       id: 'foo',
       content: <Text>foo</Text>,
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -206,6 +212,7 @@ describe('getInterfaceResponse', () => {
       id: 'foo',
       content: <Text>foo</Text>,
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -237,6 +244,7 @@ describe('getInterfaceResponse', () => {
       id: 'foo',
       content: <Text>foo</Text>,
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -268,6 +276,7 @@ describe('getInterfaceResponse', () => {
       id: 'foo',
       content: <Text>foo</Text>,
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -318,6 +327,7 @@ describe('getInterfaceResponse', () => {
         </Container>
       ),
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -360,6 +370,7 @@ describe('getInterfaceResponse', () => {
         </Container>
       ),
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -397,6 +408,7 @@ describe('getInterfaceResponse', () => {
         </Container>
       ),
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -428,6 +440,7 @@ describe('getInterfaceResponse', () => {
         </Box>
       ),
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -1359,6 +1372,7 @@ describe('getInterface', () => {
       type,
       content: getJsxElementFromComponent(content),
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -1393,6 +1407,7 @@ describe('getInterface', () => {
       type,
       content: getJsxElementFromComponent(content),
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -1542,6 +1557,54 @@ describe('getInterface', () => {
     );
   });
 
+  it('sends a request to the Snap when `pickDateTime` is called', async () => {
+    jest.spyOn(rootControllerMessenger, 'call');
+    const options = getMockOptions();
+    const { store, runSaga } = createStore(options);
+
+    const content = <DateTimePicker name="foo" />;
+
+    const id = interfaceController.createInterface(MOCK_SNAP_ID, content);
+    const type = DialogType.Alert;
+    const ui = { type: DIALOG_APPROVAL_TYPES[type], id };
+
+    const date = new Date();
+
+    store.dispatch(setInterface(ui));
+
+    const result = await runSaga(
+      getInterface,
+      runSaga,
+      MOCK_SNAP_ID,
+      rootControllerMessenger,
+      options,
+    ).toPromise();
+
+    await result.pickDateTime('foo', date);
+
+    expect(rootControllerMessenger.call).toHaveBeenCalledWith(
+      'ExecutionService:handleRpcRequest',
+      MOCK_SNAP_ID,
+      {
+        origin: 'metamask',
+        handler: HandlerType.OnUserInput,
+        request: {
+          jsonrpc: '2.0',
+          method: ' ',
+          params: {
+            event: {
+              type: UserInputEventType.InputChangeEvent,
+              name: 'foo',
+              value: date.toISOString(),
+            },
+            id,
+            context: null,
+          },
+        },
+      },
+    );
+  });
+
   it('sends a request to the snap when `uploadFile` is called', async () => {
     jest.spyOn(rootControllerMessenger, 'call');
     const options = getMockOptions();
@@ -2072,6 +2135,188 @@ describe('selectFromSelector', () => {
   });
 });
 
+describe('pickDateTime', () => {
+  const rootControllerMessenger = getRootControllerMessenger();
+  const controllerMessenger = getRestrictedSnapInterfaceControllerMessenger(
+    rootControllerMessenger,
+  );
+
+  const interfaceController = new SnapInterfaceController({
+    messenger: controllerMessenger,
+  });
+
+  const handleRpcRequestMock = jest.fn();
+
+  rootControllerMessenger.registerActionHandler(
+    'ExecutionService:handleRpcRequest',
+    handleRpcRequestMock,
+  );
+
+  it('updates the interface state and sends an InputChangeEvent', async () => {
+    jest.spyOn(rootControllerMessenger, 'call');
+
+    const content = <DateTimePicker name="foo" />;
+
+    const valueToPick = new Date('2024-01-01T12:00:00Z');
+
+    const interfaceId = interfaceController.createInterface(
+      MOCK_SNAP_ID,
+      content,
+    );
+
+    await pickDateTime(
+      rootControllerMessenger,
+      interfaceId,
+      content,
+      MOCK_SNAP_ID,
+      'foo',
+      valueToPick,
+    );
+
+    expect(rootControllerMessenger.call).toHaveBeenCalledWith(
+      'SnapInterfaceController:updateInterfaceState',
+      interfaceId,
+      { foo: valueToPick.toISOString() },
+    );
+
+    expect(handleRpcRequestMock).toHaveBeenCalledWith(MOCK_SNAP_ID, {
+      origin: 'metamask',
+      handler: HandlerType.OnUserInput,
+      request: {
+        jsonrpc: '2.0',
+        method: ' ',
+        params: {
+          event: {
+            type: UserInputEventType.InputChangeEvent,
+            name: 'foo',
+            value: valueToPick.toISOString(),
+          },
+          id: interfaceId,
+          context: null,
+        },
+      },
+    });
+  });
+
+  it('throws if there is no DateTimePicker in the interface', async () => {
+    const content = (
+      <Box>
+        <Text>Foo</Text>
+      </Box>
+    );
+
+    const interfaceId = interfaceController.createInterface(
+      MOCK_SNAP_ID,
+      content,
+    );
+
+    await expect(
+      pickDateTime(
+        rootControllerMessenger,
+        interfaceId,
+        content,
+        MOCK_SNAP_ID,
+        'bar',
+        new Date(),
+      ),
+    ).rejects.toThrow(
+      'Could not find an element in the interface with the name "bar".',
+    );
+  });
+
+  it('throws if the element is not a DateTimePicker', async () => {
+    const content = <Input name="foo" />;
+
+    const interfaceId = interfaceController.createInterface(
+      MOCK_SNAP_ID,
+      content,
+    );
+
+    await expect(
+      pickDateTime(
+        rootControllerMessenger,
+        interfaceId,
+        content,
+        MOCK_SNAP_ID,
+        'foo',
+        new Date(),
+      ),
+    ).rejects.toThrow(
+      'Expected an element of type "DateTimePicker", but found "Input".',
+    );
+  });
+
+  it('throws if the provided date is the future and the component does not allow it', async () => {
+    const content = <DateTimePicker name="foo" disableFuture={true} />;
+
+    const interfaceId = interfaceController.createInterface(
+      MOCK_SNAP_ID,
+      content,
+    );
+
+    const futureDate = new Date();
+    futureDate.setMonth(futureDate.getMonth() + 1);
+
+    await expect(
+      pickDateTime(
+        rootControllerMessenger,
+        interfaceId,
+        content,
+        MOCK_SNAP_ID,
+        'foo',
+        futureDate,
+      ),
+    ).rejects.toThrow(
+      `The selected date "${futureDate.toISOString()}" is in the future, but the DateTimePicker with the name "foo" has future dates disabled.`,
+    );
+  });
+
+  it('throws if the provided date is the past and the component does not allow it', async () => {
+    const content = <DateTimePicker name="foo" disablePast={true} />;
+
+    const interfaceId = interfaceController.createInterface(
+      MOCK_SNAP_ID,
+      content,
+    );
+
+    const pastDate = new Date();
+    pastDate.setMonth(pastDate.getMonth() - 1);
+
+    await expect(
+      pickDateTime(
+        rootControllerMessenger,
+        interfaceId,
+        content,
+        MOCK_SNAP_ID,
+        'foo',
+        pastDate,
+      ),
+    ).rejects.toThrow(
+      `The selected date "${pastDate.toISOString()}" is in the past, but the DateTimePicker with the name "foo" has past dates disabled.`,
+    );
+  });
+
+  it('throws if the provided date is invalid', async () => {
+    const content = <DateTimePicker name="foo" />;
+
+    const interfaceId = interfaceController.createInterface(
+      MOCK_SNAP_ID,
+      content,
+    );
+
+    await expect(
+      pickDateTime(
+        rootControllerMessenger,
+        interfaceId,
+        content,
+        MOCK_SNAP_ID,
+        'foo',
+        new Date('invalid-date'),
+      ),
+    ).rejects.toThrow(`Expected "value" to be a valid Date object.`);
+  });
+});
+
 describe('waitForUpdate', () => {
   const options = getMockOptions();
 
diff --git a/packages/snaps-simulation/src/interface.ts b/packages/snaps-simulation/src/interface.ts
index e3859ca7ea..fa74148c74 100644
--- a/packages/snaps-simulation/src/interface.ts
+++ b/packages/snaps-simulation/src/interface.ts
@@ -49,6 +49,7 @@ import type {
   SnapInterfaceActions,
 } from './types';
 import { formatTypeErrorMessage } from './utils/errors';
+
 /**
  * The maximum file size that can be uploaded.
  */
@@ -888,6 +889,92 @@ export async function selectFromSelector(
   });
 }
 
+/**
+ * Pick a date or time in a DateTimePicker interface element.
+ *
+ * @param controllerMessenger - The controller messenger used to call actions.
+ * @param id - The interface ID.
+ * @param content - The interface Components.
+ * @param snapId - The Snap ID.
+ * @param name - The element name.
+ * @param value - The value to pick in the element.
+ */
+export async function pickDateTime(
+  controllerMessenger: RootControllerMessenger,
+  id: string,
+  content: JSXElement,
+  snapId: SnapId,
+  name: string,
+  value: Date,
+) {
+  const result = getElement(content, name);
+
+  assert(
+    result !== undefined,
+    `Could not find an element in the interface with the name "${name}".`,
+  );
+
+  assert(
+    result.element.type === 'DateTimePicker',
+    `Expected an element of type "DateTimePicker", but found "${result.element.type}".`,
+  );
+
+  assert(
+    !isNaN(value.getTime()),
+    `Expected "value" to be a valid Date object.`,
+  );
+
+  const parsedDate = value.toISOString();
+
+  const now = new Date();
+
+  if (result.element.props.disableFuture) {
+    assert(
+      value <= now,
+      `The selected date "${parsedDate}" is in the future, but the DateTimePicker with the name "${name}" has future dates disabled.`,
+    );
+  }
+
+  if (result.element.props.disablePast) {
+    assert(
+      value >= now,
+      `The selected date "${parsedDate}" is in the past, but the DateTimePicker with the name "${name}" has past dates disabled.`,
+    );
+  }
+
+  const { state, context } = controllerMessenger.call(
+    'SnapInterfaceController:getInterface',
+    snapId,
+    id,
+  );
+
+  const newState = mergeValue(state, name, parsedDate, result.form);
+
+  controllerMessenger.call(
+    'SnapInterfaceController:updateInterfaceState',
+    id,
+    newState,
+  );
+
+  await controllerMessenger.call('ExecutionService:handleRpcRequest', snapId, {
+    origin: 'metamask',
+    handler: HandlerType.OnUserInput,
+    request: {
+      jsonrpc: '2.0',
+      method: ' ',
+      params: {
+        event: {
+          type: UserInputEventType.InputChangeEvent,
+          name: result.element.props.name,
+          value: parsedDate,
+        },
+        id,
+        context,
+      },
+    },
+  });
+}
+
 /**
  * Wait for an interface to be updated.
  *
@@ -1058,6 +1145,10 @@ export function getInterfaceActions(
       await clickElement(controllerMessenger, id, content, snapId, name);
     },
 
+    pickDateTime: async (name: string, value: Date) => {
+      await pickDateTime(controllerMessenger, id, content, snapId, name, value);
+    },
+
     typeInField: async (name: string, value: string) => {
       await typeInField(controllerMessenger, id, content, snapId, name, value);
     },
diff --git a/packages/snaps-simulation/src/request.test.tsx b/packages/snaps-simulation/src/request.test.tsx
index 1b88865e45..0a0ff88dd4 100644
--- a/packages/snaps-simulation/src/request.test.tsx
+++ b/packages/snaps-simulation/src/request.test.tsx
@@ -123,6 +123,7 @@ describe('handleRequest', () => {
       },
       id: expect.any(String),
       ok: expect.any(Function),
+      pickDateTime: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
       selectFromSelector: expect.any(Function),
       selectInDropdown: expect.any(Function),
@@ -379,6 +380,7 @@ describe('getInterfaceApi', () => {
     expect(result).toStrictEqual({
       content: getJsxElementFromComponent(content),
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
@@ -415,6 +417,7 @@ describe('getInterfaceApi', () => {
     expect(result).toStrictEqual({
       content: getJsxElementFromComponent(content),
       clickElement: expect.any(Function),
+      pickDateTime: expect.any(Function),
       typeInField: expect.any(Function),
       selectInDropdown: expect.any(Function),
       selectFromRadioGroup: expect.any(Function),
diff --git a/packages/snaps-simulation/src/types.ts b/packages/snaps-simulation/src/types.ts
index 701821f758..7c68f619d5 100644
--- a/packages/snaps-simulation/src/types.ts
+++ b/packages/snaps-simulation/src/types.ts
@@ -131,6 +131,14 @@ export type SnapInterfaceActions = {
    */
   clickElement(name: string): Promise<void>;
 
+  /**
+   * Pick a date and/or time in a DateTimePicker.
+   *
+   * @param name - The element name to pick the date/time in.
+   * @param value - The date/time value to pick.
+   */
+  pickDateTime(name: string, value: Date): Promise<void>;
+
   /**
    * Type a value in a interface field.
    *
diff --git a/packages/snaps-utils/src/time.test.ts b/packages/snaps-utils/src/time.test.ts
index aa342ba32a..67e1d609af 100644
--- a/packages/snaps-utils/src/time.test.ts
+++ b/packages/snaps-utils/src/time.test.ts
@@ -1,42 +1,6 @@
 import { create, is } from '@metamask/superstruct';
-import { DateTime } from 'luxon';
 
-import {
-  ISO8601DateStruct,
-  ISO8601DurationStruct,
-  toCensoredISO8601String,
-} from './time';
-
-describe('ISO8601DateStruct', () => {
-  it('should return true for a valid ISO 8601 date', () => {
-    const value = DateTime.now().toISO();
-    expect(is(value, ISO8601DateStruct)).toBe(true);
-  });
-
-  it('should return false for an invalid ISO 8601 date', () => {
-    const value = 'Mon Mar 31 2025';
-    expect(is(value, ISO8601DateStruct)).toBe(false);
-  });
-
-  it('should return false for an ISO 8601 date without timezone information', () => {
-    const value = '2025-03-31T12:00:00';
-    expect(is(value, ISO8601DateStruct)).toBe(false);
-  });
-
-  it('should return an error message for invalid ISO 8601 date', () => {
-    const value = 'Mon Mar 31 2025';
-    expect(() => create(value, ISO8601DateStruct)).toThrow(
-      'Not a valid ISO 8601 date',
-    );
-  });
-
-  it('should return an error message for ISO 8601 date without timezone information', () => {
-    const value = '2025-03-31T12:00:00';
-    expect(() => create(value, ISO8601DateStruct)).toThrow(
-      'ISO 8601 date must have timezone information',
-    );
-  });
-});
+import { ISO8601DurationStruct, toCensoredISO8601String } from './time';
 
 describe('ISO8601DurationStruct', () => {
   it('should return true for a valid ISO 8601 duration', () => {
diff --git a/packages/snaps-utils/src/time.ts b/packages/snaps-utils/src/time.ts
index bafa6d282f..83b8ce237c 100644
--- a/packages/snaps-utils/src/time.ts
+++ b/packages/snaps-utils/src/time.ts
@@ -17,29 +17,6 @@ export const ISO8601DurationStruct = refine(
   },
 );
 
-/**
- * Regex to match the offset part of an ISO 8601 date.
- */
-const offsetRegex = /Z|([+-]\d{2}:?\d{2})$/u;
-
-/**
- * Refines a string as an ISO 8601 date.
- */
-export const ISO8601DateStruct = refine(string(), 'ISO 8601 date', (value) => {
-  const parsedDate = DateTime.fromISO(value);
-
-  if (!parsedDate.isValid) {
-    return 'Not a valid ISO 8601 date';
-  }
-
-  if (!offsetRegex.test(value)) {
-    // Luxon doesn't have a reliable way to check if timezone info was not provided
-    return 'ISO 8601 date must have timezone information';
-  }
-
-  return true;
-});
-
 /**
  * Remove millisecond precision from an ISO 8601 string.
  *
@@ -54,3 +31,5 @@ export function toCensoredISO8601String(value: string) {
     suppressMilliseconds: true,
   }) as string;
 }
+
+export { ISO8601DateStruct } from '@metamask/snaps-sdk';
diff --git a/yarn.lock b/yarn.lock
index d9442ce3da..92547ee8f0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -4531,6 +4531,7 @@ __metadata:
     "@metamask/utils": "npm:^11.8.1"
     "@ts-bridge/cli": "npm:^0.6.1"
     "@types/jest": "npm:^27.5.1"
+    "@types/luxon": "npm:^3"
     deepmerge: "npm:^4.2.2"
     depcheck: "npm:^1.4.7"
     eslint: "npm:^9.11.0"
@@ -4539,6 +4540,7 @@ __metadata:
     jest-fetch-mock: "npm:^3.0.3"
     jest-it-up: "npm:^2.0.0"
     jest-silent-reporter: "npm:^0.6.0"
+    luxon: "npm:^3.5.0"
     prettier: "npm:^3.3.3"
     ts-jest: "npm:^29.1.1"
     typescript: "npm:~5.3.3"