diff --git a/packages/oui-page-header/README.md b/packages/oui-page-header/README.md
new file mode 100644
index 000000000..aa97a9157
--- /dev/null
+++ b/packages/oui-page-header/README.md
@@ -0,0 +1,37 @@
+# oui-page-header
+
+<component-status cx-design="complete" ux="rc"></component-status>
+oui-page-header is a package which provide styles for the page header component.
+
+## Installation
+
+```less
+  @import 'oui-page-header/page-header';
+```
+
+## Usage
+
+### Simple
+
+```html:preview
+<header class="oui-page-header">
+    <div class="oui-page-header__container">
+        <div class="oui-page-header__content">
+            <h1 class="oui-page-header__title">Title</h1>
+        </div>
+    </div>
+</header>
+```
+
+### Simple with description
+
+```html:preview
+<header class="oui-page-header">
+    <div class="oui-page-header__container">
+        <div class="oui-page-header__content">
+            <h1 class="oui-page-header__title">Title</h1>
+            <h2 class="oui-page-header__description">Description</h2>
+        </div>
+    </div>
+</header>
+```
diff --git a/packages/oui-page-header/_normalize.less b/packages/oui-page-header/_normalize.less
new file mode 100644
index 000000000..e1c28cc4a
--- /dev/null
+++ b/packages/oui-page-header/_normalize.less
@@ -0,0 +1,7 @@
+@import '../oui-typography/_mixins';
+
+#oui {
+  .page-header-normalize() {
+    #oui > .base-font();
+  }
+}
diff --git a/packages/oui-page-header/_variables.less b/packages/oui-page-header/_variables.less
new file mode 100644
index 000000000..8ba6b139d
--- /dev/null
+++ b/packages/oui-page-header/_variables.less
@@ -0,0 +1,5 @@
+// Page header
+@oui-page-header-spacing-y: rem-calc(20);
+@oui-page-header-spacing-side_s: rem-calc(32);
+@oui-page-header-spacing-side_l: rem-calc(48);
+
diff --git a/packages/oui-page-header/page-header.less b/packages/oui-page-header/page-header.less
new file mode 100644
index 000000000..a81232a03
--- /dev/null
+++ b/packages/oui-page-header/page-header.less
@@ -0,0 +1,43 @@
+@import './_variables';
+@import './_normalize';
+
+.oui-page-header {
+  #oui > .page-header-normalize();
+
+  background-color: @oui-color-nurse;
+
+  &__container {
+    padding: @oui-page-header-spacing-y @oui-page-header-spacing-side_l;
+    display: flex;
+    flex-wrap: nowrap;
+
+    @media (max-width: 1280px) {
+      padding: @oui-page-header-spacing-y @oui-page-header-spacing-side_s;
+    }
+  }
+
+  &__content {
+    flex: 1 1 100%;
+  }
+
+  &__content ~ * {
+    padding-left: rem-calc(20);
+  }
+
+  &__title {
+    margin: 0;
+    color: @oui-color-sapphire;
+    font-size: rem-calc(36);
+    font-weight: @oui-font-regular;
+  }
+
+  &__description {
+    margin: 0;
+    padding-top: rem-calc(5);
+    line-height: normal;
+    color: @oui-color-dusty;
+    font-size: rem-calc(16);
+    font-weight: @oui-font-regular;
+  }
+
+}
diff --git a/packages/oui/stylekit.less b/packages/oui/stylekit.less
index 6db712178..f8c301dab 100644
--- a/packages/oui/stylekit.less
+++ b/packages/oui/stylekit.less
@@ -47,3 +47,4 @@
 @import '../oui-collapsible/collapsible';
 @import '../oui-skeleton/skeleton';
 @import '../oui-slideshow/slideshow';
+@import '../oui-page-header/page-header';