diff --git a/app/assets/javascripts/characterCount.js b/app/assets/javascripts/characterCount.js
new file mode 100644
index 000000000..97232c615
--- /dev/null
+++ b/app/assets/javascripts/characterCount.js
@@ -0,0 +1,39 @@
+(function(Modules) {
+  "use strict";
+
+  Modules.CharacterCount = function() {
+
+    this.start = function(component) {
+
+      var getCharacterCount = () =>
+        ($textarea.val()).length;
+
+      var getLengthOfOneMessage = () =>
+        160 - (serviceName + ': ').length;
+
+      var $component = $(component);
+
+      var serviceName = $component.data('service-name');
+
+      var $textarea = $('textarea', $component)
+        .eq(0)
+        .on('change keyup paste', () => $counter.html(`
+          ${getCharacterCount()} of ${getLengthOfOneMessage()} characters
+        `));
+
+      $component
+        .append($counter = $(`
+          <p class="textbox-character-count"
+            role="status" aria-live="polite" aria-relevant="text"
+            id="word-count-${$textarea.prop('name')}"
+          />
+        `));
+
+      $textarea
+        .trigger('change');
+
+    };
+
+  };
+
+})(window.GOVUK.Modules);
diff --git a/app/assets/stylesheets/components/textbox.scss b/app/assets/stylesheets/components/textbox.scss
index 27ee0d1f8..d49b0c6c6 100644
--- a/app/assets/stylesheets/components/textbox.scss
+++ b/app/assets/stylesheets/components/textbox.scss
@@ -54,3 +54,9 @@
 .textbox-right-aligned {
   text-align: right;
 }
+
+.textbox-character-count {
+  @include core-19($tabular-numbers: true);
+  margin: 10px 0 0 0;
+  color: $secondary-text-colour;
+}
diff --git a/app/templates/components/textbox.html b/app/templates/components/textbox.html
index 40d141072..cfd6f15d2 100644
--- a/app/templates/components/textbox.html
+++ b/app/templates/components/textbox.html
@@ -9,9 +9,16 @@
   width='2-3',
   suffix=None,
   safe_error_message=False,
-  rows=8
+  rows=8,
+  character_count=False,
+  service_name=None
 ) %}
-  <div class="form-group{% if field.errors %} error{% endif %}" {% if autofocus %}data-module="autofocus"{% endif %}>
+  <div
+    class="form-group{% if field.errors %} error{% endif %}"
+    {% if autofocus %}data-module="autofocus"{% endif %}
+    {% if character_count %}data-module="character-count"{% endif %}
+    {% if service_name %}data-service-name="{{ service_name }}"{% endif %}
+  >
     <label class="form-label" for="{{ field.name }}">
       {% if label %}
         {{ label }}
diff --git a/app/templates/views/edit-sms-template.html b/app/templates/views/edit-sms-template.html
index 45d6d7fe4..8d6c80d4a 100644
--- a/app/templates/views/edit-sms-template.html
+++ b/app/templates/views/edit-sms-template.html
@@ -18,7 +18,14 @@
           {{ textbox(form.name, width='1-1', hint='Your recipients won’t see this') }}
         </div>
         <div class="column-two-thirds">
-          {{ textbox(form.template_content, highlight_tags=True, width='1-1', rows=5) }}
+          {{ textbox(
+            form.template_content,
+            highlight_tags=True,
+            character_count=True,
+            width='1-1',
+            service_name=current_service.name,
+            rows=5
+          ) }}
           {{ page_footer(
             'Save',
             delete_link=url_for('.delete_service_template', service_id=current_service.id, template_id=template_id) if template_id or None,
diff --git a/app/templates/views/pricing.html b/app/templates/views/pricing.html
index 34f47e3f5..d92cd0d68 100644
--- a/app/templates/views/pricing.html
+++ b/app/templates/views/pricing.html
@@ -20,12 +20,15 @@
 
     <ul class="list list-bullet">
       <li>Free allowance: 250,000 text messages per service, per financial year</li>
-      <li>If your messages are long, they will count as 2 or 3 text messages, depending on length:
-      <ul class="list list-bullet">
-        <li>Up to 160 characters = 1 text message</li>
-        <li>Up to 306 characters = 2 text messages</li>
-        <li>Up to 459 characters = 3 text messages</li>
-      </ul></li>
+      <li>
+        If your messages are long, they will count as 2 or 3 text messages, depending on length:
+        <ul class="list list-bullet">
+          <li>Up to 160 characters = 1 text message</li>
+          <li>Up to 306 characters = 2 text messages</li>
+          <li>Up to 459 characters = 3 text messages</li>
+          <li>Your service name counts towards the length of your message</li>
+        </ul>
+      </li>
       <li>Standard text message rate: 1.8p + VAT</li>
     </ul>
 
diff --git a/gulpfile.babel.js b/gulpfile.babel.js
index 1f8ee9e50..013fd3f2f 100644
--- a/gulpfile.babel.js
+++ b/gulpfile.babel.js
@@ -61,6 +61,7 @@ gulp.task('javascripts', () => gulp
     paths.src + 'javascripts/updateContent.js',
     paths.src + 'javascripts/expandCollapse.js',
     paths.src + 'javascripts/placeholderHint.js',
+    paths.src + 'javascripts/characterCount.js',
     paths.src + 'javascripts/main.js'
   ])
   .pipe(plugins.babel({
diff --git a/tests/app/main/views/test_templates.py b/tests/app/main/views/test_templates.py
index 952ed1d49..c9ae21957 100644
--- a/tests/app/main/views/test_templates.py
+++ b/tests/app/main/views/test_templates.py
@@ -29,10 +29,14 @@ def test_should_show_page_for_one_templates(app_,
                 template_id=template_id))
 
     assert response.status_code == 200
-    assert "Two week reminder" in response.get_data(as_text=True)
-    assert "Your vehicle tax is about to expire" in response.get_data(as_text=True)
+    content = response.get_data(as_text=True)
+    assert "Two week reminder" in content
+    assert "Your vehicle tax is about to expire" in content
+    assert 'data-module="character-count"' in content
+    assert 'data-service-name="Test Service"' in content
     mock_get_service_template.assert_called_with(
-        service_id, template_id)
+        service_id, template_id
+    )
 
 
 def test_should_redirect_when_saving_a_template(app_,