diff --git a/Skuid_Techniques/Grid_Examples/Grid_Examples.png b/Skuid_Techniques/Grid_Examples/Grid_Examples.png
new file mode 100644
index 0000000..c76ff57
Binary files /dev/null and b/Skuid_Techniques/Grid_Examples/Grid_Examples.png differ
diff --git a/Skuid_Techniques/Grid_Examples/Grid_Examples.xml b/Skuid_Techniques/Grid_Examples/Grid_Examples.xml
new file mode 100644
index 0000000..2e06628
--- /dev/null
+++ b/Skuid_Techniques/Grid_Examples/Grid_Examples.xml
@@ -0,0 +1,585 @@
+
+
+
+
+
+
+ ={{index}}*3-2
+
+
+
+
+
+
+
+
+
+ {{index}}*3-1
+
+
+
+
+
+
+
+
+
+ {{index}}*3
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ ((skuid) => {
+ skuid.events.subscribeOnce("pageload", () => {
+
+ //load first model
+ const model1 = skuid.model.getModel('SampleData1');
+ for (var i = 1; i < 11; i++){
+ var newRow = model1.createRow({
+ doAppend: (true),
+ additionalConditions: [{
+ field: "height",
+ value: Math.floor(Math.random() * 325) + 50,
+ },{
+ field: "count",
+ value: (i * 3) - 2,
+ }]
+ })
+ }
+ //load second model
+ const model2 = skuid.model.getModel('SampleData2');
+ for (var i = 1; i < 11; i++){
+ var newRow = model2.createRow({
+ doAppend: (true),
+ additionalConditions: [{
+ field: "height",
+ value: Math.floor(Math.random() * 325) + 50,
+ },{
+ field: "count",
+ value: (i * 3) - 1,
+ }]
+ })
+ }
+
+ //load third model
+ const model3 = skuid.model.getModel('SampleData3');
+ for (var i = 1; i < 11; i++){
+ var newRow = model3.createRow({
+ doAppend: (true),
+ additionalConditions: [{
+ field: "height",
+ value: Math.floor(Math.random() * 325) + 50,
+ },{
+ field: "count",
+ value: (i * 3),
+ }]
+ })
+ }
+
+ });
+})(skuid)
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/Skuid_Techniques/Grid_Examples/README.MD b/Skuid_Techniques/Grid_Examples/README.MD
new file mode 100644
index 0000000..ff056ad
--- /dev/null
+++ b/Skuid_Techniques/Grid_Examples/README.MD
@@ -0,0 +1,43 @@
+# Responsive Grid Examples
+
+The Responsive Grid component is the primary way to arrange elements on a Skuid Page. This Example page has 7 different examples of grid configuration - used to achieve effective layout results.
+
+
+
+
+## Instructions
+- Page API: V2
+- Data source: Only uses UI-Only Models
+- Design system: None
+- Page XML: [Copy the XML from this page](GridExamples.xml?raw=true), or save it as an XML file, and upload it as a new page in your Salesforce Org.
+
+## Notes
+A key thought process:
+
+Providing space around information makes it much easier for your users to work with it - either reviewing that information or updating it in some way. A page that appropriately uses white space appears to breathe, and invites interaction rather than simply overwhelming with wall to wall data. Using the responsive grid as a standard part of your Skuid building habits will help your pages breathe.
+
+But the properties of the grid are a bit confusing to work with. This page provides some examples. Copy these properties into your own builds to achieve better results.
+
+Details below about each example in the page.
+
+### Stretch All
+If you keep the `Flex Ratio` and `Minimum Width` property the same across all divisions - they will stretch evenly as your page grows.
+
+### Stretch Middle
+If you give static divisions an equal `Minimum Width` and `Maximum Width` they will not grow with your page. But the other content will.
+
+### Alternating Grid
+Using percentages for width in your divisions allows the grids to move as page grows, but also allows you to set some divisions to be full width while others are not.
+
+### Fluid Blocks
+For a "Tiles" approach to content that has different heights, Use multiple Decks - which also use the Responsive grid to arrange content. Dividing your data into multiple models that drive each decks may be interesting. But there are strategies...
+
+### Vertical / Horizontal Center
+Look at the `Justify divisions` and `Align Divisions` properties on the grid to affect the way content is centered.
+
+### Vertical Stretch
+The properties that control how tall an element is is not on the Division - but rather must be added to a Wrapper inside the division. Look for Height and Scrolling properties for the two examples here.
+
+## Related Links
+
+- [Internal link in Demo Org](https://skuid-demo--skuid.na37.visual.force.com/apex/skuid__ui?page=GridExamples) (for Skuid Employees only)
\ No newline at end of file
diff --git a/Skuid_Techniques/README.md b/Skuid_Techniques/README.md
index ae402be..33fa021 100644
--- a/Skuid_Techniques/README.md
+++ b/Skuid_Techniques/README.md
@@ -7,6 +7,7 @@ We know its true - some of the coolest capabilities provided by Skuid are compli
- [Adding related records to drawers](Drawers_Related_Records)
- [Advanced Filtering Techniques](Filters_Using_Forms)
- [Carousel Examples](Carousel_Examples)
+- [Grid Examples](Grid_Examples)
- [Key Indicators Dashboard](KeyIndicators)
- [Multi Part Forms](Multi_Part_Form)
- [Navigating Complex Forms](Navigation)