diff --git a/data/db.yml b/data/db.yml
index 860c0d9..07bf477 100644
--- a/data/db.yml
+++ b/data/db.yml
@@ -1070,6 +1070,17 @@ blocks:
               type: paragraph
           type: doc
       id: 6-qXFUJ0eH
+    6DYmRbbcZv:
+      blockType: pattern-variations
+      data:
+        demoId: ''
+        excludePropValue: ''
+        includePropValue: ''
+        patternId: layout
+        templateId: ''
+        variationId: ''
+      id: 6DYmRbbcZv
+      size: null
     6eHTQ_DA5d:
       blockType: text-editor
       data:
@@ -1894,6 +1905,18 @@ blocks:
               type: heading
           type: doc
       id: DRNLXHrlPG
+    DV3f3cUshu:
+      blockType: text-editor
+      data:
+        content:
+          content:
+            - content:
+                - text: "Hey! Layouts are hard.\_"
+                  type: text
+              type: paragraph
+          type: doc
+      id: DV3f3cUshu
+      size: null
     DZDCl_8hOO:
       blockType: text-editor
       data:
@@ -3966,6 +3989,14 @@ blocks:
           type: doc
       id: ctwMU8NUmw
       size: null
+    dLxcPcvhZq:
+      blockType: component-spec-block
+      data:
+        collapsible: false
+        patternId: layout
+        templateId: react
+      id: dLxcPcvhZq
+      size: null
     dWwXgDQUjj:
       blockType: divider-block
       id: dWwXgDQUjj
diff --git a/data/knapsack.custom-page.homepage.yml b/data/knapsack.custom-page.homepage.yml
index f84a562..82ac75b 100644
--- a/data/knapsack.custom-page.homepage.yml
+++ b/data/knapsack.custom-page.homepage.yml
@@ -5,7 +5,7 @@ settings:
     size: full
     textColorTitle:
       type: design-token
-      tokenName: color.base.red
+      tokenName: color.base.blue
     backgroundImage: >-
       https://knapsack.imgix.net/site/workshop-demo/insurance-concept-with-icons-for-car-home-medical-insurance-68afjwupqb.jpg
     textColorDescription:
diff --git a/data/knapsack.pattern.layout.json b/data/knapsack.pattern.layout.json
index e4fd663..ed1ac45 100644
--- a/data/knapsack.pattern.layout.json
+++ b/data/knapsack.pattern.layout.json
@@ -8,6 +8,10 @@
     {
       "id": "react",
       "type": "template"
+    },
+    {
+      "id": "8hMllLUfBj",
+      "type": "subPage"
     }
   ],
   "title": "Layout",
@@ -15,13 +19,18 @@
     "twig": "needs-dev",
     "react": "ready",
     "design": "ready",
-    "web-components": "needs-dev"
+    "web-components": "ready"
   },
   "subPages": [
     {
       "id": "Figma",
       "title": "Figma",
       "blockIds": ["YEkgV9IhxW", "kKTr9MvIOY"]
+    },
+    {
+      "id": "8hMllLUfBj",
+      "title": "Layout Test",
+      "blockIds": ["DV3f3cUshu", "dLxcPcvhZq"]
     }
   ],
   "templates": [