diff --git a/docs/pages/blog/introducing-pigment-css.js b/docs/pages/blog/introducing-pigment-css.js
new file mode 100644
index 00000000000000..2c643a7f0c6647
--- /dev/null
+++ b/docs/pages/blog/introducing-pigment-css.js
@@ -0,0 +1,7 @@
+import * as React from 'react';
+import TopLayoutBlog from 'docs/src/modules/components/TopLayoutBlog';
+import { docs } from './introducing-pigment-css.md?muiMarkdown';
+
+export default function Page() {
+  return <TopLayoutBlog docs={docs} />;
+}
diff --git a/docs/pages/blog/introducing-pigment-css.md b/docs/pages/blog/introducing-pigment-css.md
new file mode 100644
index 00000000000000..9d0188aaecad52
--- /dev/null
+++ b/docs/pages/blog/introducing-pigment-css.md
@@ -0,0 +1,8 @@
+---
+title: 'Introducing Pigment CSS'
+description: 'TK'
+date: 2024-05-14T00:00:00.000Z
+authors: ['samuelsycamore']
+tags: ['Pigment CSS']
+card: false
+---