diff --git a/apps/website/src/content/docs/divider.mdx b/apps/website/src/content/docs/divider.mdx
new file mode 100644
index 00000000000..df990f6a481
--- /dev/null
+++ b/apps/website/src/content/docs/divider.mdx
@@ -0,0 +1,24 @@
+---
+title: Divider
+description: A divider can be used to separate a layout into different sections of content or element.
+group: utilities
+thumbnail: #TODO
+---
+
+
{frontmatter.description}
+
+
+
+
+
+## Vertical
+
+The `Divider` component is displayed horizontally by default. To display it vertically, use the `orientation` prop.
+
+
+
+
+
+## Props
+
+
diff --git a/examples/Divider.main.css b/examples/Divider.main.css
new file mode 100644
index 00000000000..4faf687581d
--- /dev/null
+++ b/examples/Divider.main.css
@@ -0,0 +1,6 @@
+.demo-container {
+ display: flex;
+ flex-direction: column;
+ align-items: center;
+ gap: 0.5rem;
+}
diff --git a/examples/Divider.main.jsx b/examples/Divider.main.jsx
new file mode 100644
index 00000000000..40a5cb94142
--- /dev/null
+++ b/examples/Divider.main.jsx
@@ -0,0 +1,16 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import * as React from 'react';
+import { Divider, Text } from '@itwin/itwinui-react';
+
+export default () => {
+ return (
+
+
Section 1
+
+
Section 2
+
+ );
+};
diff --git a/examples/Divider.vertical.css b/examples/Divider.vertical.css
new file mode 100644
index 00000000000..8b978551f7d
--- /dev/null
+++ b/examples/Divider.vertical.css
@@ -0,0 +1,6 @@
+.demo-container {
+ display: flex;
+ flex-direction: row;
+ gap: 1rem;
+ align-items: center;
+}
diff --git a/examples/Divider.vertical.jsx b/examples/Divider.vertical.jsx
new file mode 100644
index 00000000000..84eff3afc22
--- /dev/null
+++ b/examples/Divider.vertical.jsx
@@ -0,0 +1,16 @@
+/*---------------------------------------------------------------------------------------------
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
+ * See LICENSE.md in the project root for license terms and full copyright notice.
+ *--------------------------------------------------------------------------------------------*/
+import * as React from 'react';
+import { Divider, Text } from '@itwin/itwinui-react';
+
+export default () => {
+ return (
+
+
Section 1
+
+
Section 2
+
+ );
+};
diff --git a/examples/index.tsx b/examples/index.tsx
index 43269b0bf5d..53c4f28ead1 100644
--- a/examples/index.tsx
+++ b/examples/index.tsx
@@ -441,6 +441,16 @@ export { DialogPlacementExample };
// ----------------------------------------------------------------------------
+import { default as DividerMainExampleRaw } from './Divider.main';
+const DividerMainExample = withThemeProvider(DividerMainExampleRaw);
+export { DividerMainExample };
+
+import { default as DividerVerticalExampleRaw } from './Divider.vertical';
+const DividerVerticalExample = withThemeProvider(DividerVerticalExampleRaw);
+export { DividerVerticalExample };
+
+// ----------------------------------------------------------------------------
+
import { default as DropdownButtonMainExampleRaw } from './DropdownButton.main';
const DropdownButtonMainExample = withThemeProvider(
DropdownButtonMainExampleRaw,