diff --git a/app/assets/stylesheets/govuk-component/_govspeak.scss b/app/assets/stylesheets/govuk-component/_govspeak.scss
index 83176edb7..9ff574d02 100644
--- a/app/assets/stylesheets/govuk-component/_govspeak.scss
+++ b/app/assets/stylesheets/govuk-component/_govspeak.scss
@@ -1,16 +1,18 @@
 @import "govspeak/attachment";
-@import "govspeak/call-out-block";
+@import "govspeak/call-to-action";
 @import "govspeak/charts";
 @import "govspeak/contact";
 @import "govspeak/example";
 @import "govspeak/footnotes";
 @import "govspeak/fraction";
 @import "govspeak/images";
+@import "govspeak/information-callout";
 @import "govspeak/legislative-list";
 @import "govspeak/media-player";
 @import "govspeak/stat-headline";
 @import "govspeak/tables";
 @import "govspeak/typography";
+@import "govspeak/warning-callout";
 
 .govuk-govspeak {
   &.direction-rtl {
diff --git a/app/assets/stylesheets/govuk-component/govspeak/_call-out-block.scss b/app/assets/stylesheets/govuk-component/govspeak/_call-out-block.scss
deleted file mode 100644
index 5d2d4418b..000000000
--- a/app/assets/stylesheets/govuk-component/govspeak/_call-out-block.scss
+++ /dev/null
@@ -1,57 +0,0 @@
-// Govspeak call out blocks
-// http://govuk-component-guide.herokuapp.com/components/govspeak/fixtures/call_out_blocks
-//
-// Support:
-//
-// `call-to-action` exists within alphagov/govspeak, but no signs of anything
-// that generates HTML using the `information-block` class in alphagov or
-// kramdown.
-//
-// - alphagov/whitehall: ⁉
-// - alphagov/govspeak: ⁉
-
-.govuk-govspeak {
-  .information-block,
-  .call-to-action {
-    margin-top: $gutter;
-    margin-bottom: $gutter;
-    background-color: $panel-colour;
-    padding: $gutter-half;
-    position: relative;
-
-    &:first-child {
-      margin-top: 0;
-    }
-
-    p:last-child,
-    ul:last-child,
-    ol:last-child {
-      margin-bottom: 0;
-    }
-
-    ol {
-      @include media(desktop) {
-        list-style-position: outside;
-      }
-    }
-  }
-
-  .information-block {
-    padding-right: $gutter * 2;
-  }
-
-  .information-block:after {
-    content: "info";
-    text-indent: -9999px;
-    background-color: $govuk-blue;
-    background-image: image-url('govuk-component/govspeak-information-icon.png');
-    background-position: center;
-    height: $gutter;
-    width: $gutter;
-    position: absolute;
-    overflow: hidden;
-    top: $gutter-two-thirds;
-    right: $gutter-two-thirds;
-    @include border-radius($gutter);
-  }
-}
diff --git a/app/assets/stylesheets/govuk-component/govspeak/_call-to-action.scss b/app/assets/stylesheets/govuk-component/govspeak/_call-to-action.scss
new file mode 100644
index 000000000..0db729379
--- /dev/null
+++ b/app/assets/stylesheets/govuk-component/govspeak/_call-to-action.scss
@@ -0,0 +1,25 @@
+// Govspeak call to action
+// http://govuk-component-guide.herokuapp.com/components/govspeak/fixtures/call_to_action
+//
+// Support:
+//
+// - alphagov/whitehall: ✔︎
+// - alphagov/govspeak: ✔︎
+
+.govuk-govspeak {
+  .call-to-action {
+    margin: 2em 0;
+    background-color: $panel-colour;
+    padding: 2em;
+
+    &:first-child {
+      margin-top: 0;
+    }
+
+    p:last-child,
+    ul:last-child,
+    ol:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/govuk-component/govspeak/_example.scss b/app/assets/stylesheets/govuk-component/govspeak/_example.scss
index ce56032f7..19faab6b3 100644
--- a/app/assets/stylesheets/govuk-component/govspeak/_example.scss
+++ b/app/assets/stylesheets/govuk-component/govspeak/_example.scss
@@ -7,9 +7,16 @@
 
 .govuk-govspeak {
   .example {
-    border-left: 10px solid $panel-colour;
-    padding-left: 1.5em;
-    margin: 2.5em 0;
+    border-left: 1em solid $panel-colour;
+    padding: 1em 0 1em 1em;
+    margin: 2em 0;
+
+    // Remove margin from the last element
+    p:last-child,
+    ul:last-child,
+    ol:last-child {
+      margin-bottom: 0;
+    }
 
     strong {
       display: block;
diff --git a/app/assets/stylesheets/govuk-component/govspeak/_information-callout.scss b/app/assets/stylesheets/govuk-component/govspeak/_information-callout.scss
new file mode 100644
index 000000000..c7a4175d6
--- /dev/null
+++ b/app/assets/stylesheets/govuk-component/govspeak/_information-callout.scss
@@ -0,0 +1,22 @@
+// Govspeak information callout
+// http://govuk-component-guide.herokuapp.com/components/govspeak/fixtures/information_callout
+//
+// Support:
+//
+// - alphagov/whitehall: ✔︎
+// - alphagov/govspeak: ✔︎
+
+.govuk-govspeak {
+  .info-notice {
+    border-left: 1em solid $panel-colour;
+    padding: 1em 0 1em 1em;
+    margin: 2em 0;
+
+    // Remove margin from the last element
+    p:last-child,
+    ul:last-child,
+    ol:last-child {
+      margin-bottom: 0;
+    }
+  }
+}
diff --git a/app/assets/stylesheets/govuk-component/govspeak/_warning-callout.scss b/app/assets/stylesheets/govuk-component/govspeak/_warning-callout.scss
new file mode 100644
index 000000000..2333a073f
--- /dev/null
+++ b/app/assets/stylesheets/govuk-component/govspeak/_warning-callout.scss
@@ -0,0 +1,41 @@
+// Govspeak warning callout
+// http://govuk-component-guide.herokuapp.com/components/govspeak/fixtures/warning_callout
+//
+// Support:
+//
+// - alphagov/whitehall: ✔︎
+// - alphagov/govspeak: ✔︎
+
+.govuk-govspeak {
+  .help-notice {
+    $icon-size: 34px;
+    $line-height-mobile: 20px;
+    $line-height-tablet: 25px;
+
+    margin: 2em 0;
+
+    // Add '!' icon
+    background-image: image-url("icon-important.png");
+    background-size: $icon-size $icon-size;
+    background-repeat: no-repeat;
+
+    @include device-pixel-ratio() {
+      background-image: image-url("icon-important-2x.png");
+    }
+
+    min-height: $icon-size;
+    padding-left: $icon-size;
+
+    // Center the icon around the baseline
+    padding-top: ($icon-size - $line-height-mobile) / 2;
+
+    @include media(tablet) {
+      padding-top: ($icon-size - $line-height-tablet) / 2;
+    }
+
+    p {
+      @include bold-19;
+      margin-left: 1em;
+    }
+  }
+}
diff --git a/app/views/govuk_component/docs/govspeak.yml b/app/views/govuk_component/docs/govspeak.yml
index 4b804f3ee..3edf0a9f5 100644
--- a/app/views/govuk_component/docs/govspeak.yml
+++ b/app/views/govuk_component/docs/govspeak.yml
@@ -121,15 +121,6 @@ fixtures:
         <p>My quote</p>
         <p class="last-child">about things</p>
       </blockquote>
-  call_out_blocks:
-    content: |
-      <div class="information-block">
-        <p>My important information</p>
-        <p>Information</p>
-      </div>
-      <div class="call-to-action">
-        <p>Call to action</p>
-      </div>
   tables:
     content: |
       <table>
@@ -511,7 +502,31 @@ fixtures:
     content: |
       <div class="example">
         <p>
+          <strong>Example</strong>
           This is an indented example block.<br/>
           It may span multiple lines, <a href="#">contain links</a>.
         </p>
+        <p>
+          It may even span multiple paragraphs.
+        </p>
+      </div>
+  call_to_action:
+    content: |
+      <div class="call-to-action">
+        <p>Call to action</p>
+      </div>
+  information_callout:
+    content: |
+      <div class="application-notice info-notice">
+        <p>
+          If you drilled a tunnel straight through the Earth and jumped in, it would take
+          you exactly 42 minutes and 12 seconds to get to the other side.
+        </p>
+      </div>
+  warning_callout:
+    content: |
+      <div class="application-notice help-notice">
+        <p>
+          The water in the mouth of a blue whale weighs more than its body.
+        </p>
       </div>