diff --git a/Gemfile b/Gemfile
index ced72f6dc..e8138ee50 100644
--- a/Gemfile
+++ b/Gemfile
@@ -12,7 +12,7 @@ gem 'sass-rails', "5.0.6"
 gem 'asset_bom_removal-rails', '~> 1.0.0'
 gem 'nokogiri', "~> 1.7"
 gem 'redis', "~> 3.3.3"
-gem 'govuk_publishing_components', '~> 1.12.1', require: false
+gem 'govuk_publishing_components', '~> 2.0.0', require: false
 gem 'govuk_app_config', '~> 0.3.0'
 
 group :development do
diff --git a/Gemfile.lock b/Gemfile.lock
index da5a0494e..66ef3eec3 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -109,7 +109,7 @@ GEM
     govuk_frontend_toolkit (7.2.0)
       railties (>= 3.1.0)
       sass (>= 3.2.0)
-    govuk_publishing_components (1.12.1)
+    govuk_publishing_components (2.0.0)
       govspeak (>= 5.0.3)
       govuk_frontend_toolkit
       rails (>= 5.0.0.1)
@@ -326,7 +326,7 @@ DEPENDENCIES
   govuk-lint (~> 3.3.1)
   govuk_app_config (~> 0.3.0)
   govuk_frontend_toolkit (~> 7.2.0)
-  govuk_publishing_components (~> 1.12.1)
+  govuk_publishing_components (~> 2.0.0)
   govuk_template (= 0.23.0)
   image_optim (= 0.17.1)
   jasmine-rails (~> 0.14.1)
diff --git a/app/assets/stylesheets/govuk-component/_button.scss b/app/assets/stylesheets/govuk-component/_button.scss
index b4620e299..5d20e5fc9 100644
--- a/app/assets/stylesheets/govuk-component/_button.scss
+++ b/app/assets/stylesheets/govuk-component/_button.scss
@@ -13,6 +13,13 @@
   }
 }
 
+// this will be moved and extended into a model for general component spacing
+// once this has been decided upon and other work completed, see:
+// https://trello.com/c/KEkNsxG3/142-3-implement-customisable-spacing-for-components
+.pub-c-button--bottom-margin {
+  @include responsive-bottom-margin;
+}
+
 %pub-c-button--start,
 .pub-c-button--start {
   @include bold-24($line-height: (24 / 20));
diff --git a/app/views/govuk_component/button.raw.html.erb b/app/views/govuk_component/button.raw.html.erb
index 1efe9370f..ef2cb98f9 100644
--- a/app/views/govuk_component/button.raw.html.erb
+++ b/app/views/govuk_component/button.raw.html.erb
@@ -5,6 +5,7 @@
   rel ||= false
   text ||= ""
   tag_name = href ? "a" : "button"
+  margin_bottom ||= false
 %>
 <<%= tag_name %>
   class="
@@ -12,6 +13,7 @@
     <% if start == true %>
       pub-c-button--start
     <% end %>
+    <%= " pub-c-button--bottom-margin" if margin_bottom %>
   "
   <% if href %>
     href="<%= href.try(:html_safe) %>"
diff --git a/app/views/govuk_component/docs/button.yml b/app/views/govuk_component/docs/button.yml
index 13f523a15..63c635e10 100644
--- a/app/views/govuk_component/docs/button.yml
+++ b/app/views/govuk_component/docs/button.yml
@@ -48,6 +48,11 @@ examples:
       href: "#"
       start: true
       info_text: "Sometimes you want to explain where a user is going to."
+  with_margin_bottom:
+    description: "Sometimes it's useful to break up a page, for example if a button is at the bottom of a page."
+    data:
+      text: "Submit"
+      margin_bottom: true
   extreme_text:
     data:
       text: "I'm a button with lots of text to test how the component scales at extremes."
diff --git a/app/views/govuk_component/docs/document_footer.yml b/app/views/govuk_component/docs/document_footer.yml
index 61481ed94..038f1c059 100644
--- a/app/views/govuk_component/docs/document_footer.yml
+++ b/app/views/govuk_component/docs/document_footer.yml
@@ -9,6 +9,8 @@ accessibility_criteria: |
 
 shared_accessibility_criteria:
   - link
+accessibility_excluded_rules:
+  - 'duplicate-id' # ids used in this component are for anchoring from another component
 examples:
   from_only:
     data:
diff --git a/app/views/govuk_component/docs/government_navigation.yml b/app/views/govuk_component/docs/government_navigation.yml
index 8d3c63ead..d42fbf869 100644
--- a/app/views/govuk_component/docs/government_navigation.yml
+++ b/app/views/govuk_component/docs/government_navigation.yml
@@ -8,6 +8,8 @@ accessibility_criteria: |
   - Be identified as a [navigation landmark](https://www.w3.org/TR/wai-aria-practices-1.1/#aria_lh_navigation)
 shared_accessibility_criteria:
   - link
+accessibility_excluded_rules:
+  - 'duplicate-id' # ids used in this component are for slimmer to use when moving this component into the header
 examples:
   default:
     data: {}
diff --git a/app/views/govuk_component/docs/option_select.yml b/app/views/govuk_component/docs/option_select.yml
index 1f1b71cbe..ebfa6719a 100644
--- a/app/views/govuk_component/docs/option_select.yml
+++ b/app/views/govuk_component/docs/option_select.yml
@@ -85,7 +85,7 @@ examples:
       The aria_controls_id must be set to the ID of an element that’s on the page or it won’t be included.
     data:
       key: with_aria-control_set
-      title: List of options
+      title: List of options (with aria controls)
       aria_controls_id: js-update-region-id
       options_container_id: list_of_countries
       options:
diff --git a/test/govuk_component/button_test.rb b/test/govuk_component/button_test.rb
index 0322fec45..a1c1fe781 100644
--- a/test/govuk_component/button_test.rb
+++ b/test/govuk_component/button_test.rb
@@ -55,4 +55,13 @@ def component_name
     render_component(text: "Start now", rel: "nofollow preload")
     assert_select ".pub-c-button[rel='nofollow preload']", text: "Start now"
   end
+
+  test "renders margin bottom class correctly" do
+    render_component(text: "Submit")
+    assert_select ".pub-c-button", text: "Submit"
+    assert_select ".pub-c-button--bottom-margin", count: 0
+
+    render_component(text: "Submit", margin_bottom: true)
+    assert_select ".pub-c-button.pub-c-button--bottom-margin", text: "Submit"
+  end
 end