diff --git a/content/ui-patterns/saving.mdx b/content/ui-patterns/saving.mdx
new file mode 100644
index 0000000000000000000000000000000000000000..ecba41d924c5642c65552971c48d84c09dc3cad5
--- /dev/null
+++ b/content/ui-patterns/saving.mdx
@@ -0,0 +1,31 @@
+---
+title: Saving
+---
+import Saving1 from '../../images/saving/saving1.png'
+
+GitHub's save patterns help users to store and update their configurations for different features throughout GitHub's various interfaces. These changes should be represented in the UI accurately, quickly, and obviously. Their behavior should be easy to reason about and inspire confidence and trust.
+
+Punctuate all configuration flows with CTAs that feature a logical term such as "Create", "Save", "Delete", or "Update" (e.g. "Create" a new repository, "Add" an SSH key to your profile, "Save" security preferences, "Update" a repository's description, "Delete" an old email address). 
+
+1. In general, use the least possible text. 
+2. In cases where it may be unclear to the user which entity is changing, you can add the entity's name to the button also.
+
+<img src={Saving1} alt='Examples of button labels' />
+
+For individual settings that are not changed via discrete flows, minimize the required UI by saving configuration changes as they are made (e.g. changing your primary email address, adding an assignee to an issue, unsubscribing from a notification type, following a user, watching a repository).
+
+## Patterns
+
+There are two primary patterns for saving configuration on GitHub.
+
+### Save and route
+Use this pattern for creation and deletion of new entities such as repositories, organizations, or user accounts. At the end of the flow, route the user to the entity they just created. In some cases such as forking or using a template, you may need to hold the user at a waiting page while the entity is generated. In these cases, make the user feel confident that something is happening and that their configuration details will not be lost. In cases where there is not an entity-specific page to route the user to, explicitly indicate that the interaction has occurred by using a [`toast`](https://primer.style/css/components/toasts).
+
+### Optimistic update
+For interactions where the entity already exists and the user merely needs to update a field on that object, default to using async server requests and optimistic UI updates. If the change may not be obvious in the UI within the user's viewport, trigger a [Toast](https://primer.style/css/components/toasts) to let the user know that the change occurred successfully. 
+
+In cases where we need to prevent the user from taking further action while the request completes (such as updating notification preferences) we should use the `data-disable-with` property with the present form of the action's verb (e.g. "Save" becomes "Saving...", "Follow" becomes "Following...") to indicate that they shouldn't navigate away from the current page which may cause the request to fail silently in the event of an error. In most cases, these actions should take minimal time, but in cases where it takes longer than normal, this clear indication is invaluable.
+
+```html
+  <input type="submit" data-disable-with="Submitting...">Submit</input>
+```
\ No newline at end of file
diff --git a/images/saving/saving1.png b/images/saving/saving1.png
new file mode 100644
index 0000000000000000000000000000000000000000..021d364f20fa293e4f001607fd00263005b8306e
Binary files /dev/null and b/images/saving/saving1.png differ
diff --git a/src/@primer/gatsby-theme-doctocat/nav.yml b/src/@primer/gatsby-theme-doctocat/nav.yml
index e02e080a7f36859fe278354fa9271c9bf6e027f7..d2218cdadd8ccaee4d972ad773fe7c9980739aa7 100644
--- a/src/@primer/gatsby-theme-doctocat/nav.yml
+++ b/src/@primer/gatsby-theme-doctocat/nav.yml
@@ -15,10 +15,12 @@
       url: /ui-patterns/button-usage
     - title: Empty states
       url: /ui-patterns/empty-states
-    - title: Progressive disclosure
-      url: /ui-patterns/progressive-disclosure
     - title: Messaging
       url: /ui-patterns/messaging
+    - title: Progressive disclosure
+      url: /ui-patterns/progressive-disclosure
+    - title: Saving
+      url: /ui-patterns/saving
 - title: Design tools
   url: /tools
   children: