diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textarea/textarea.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textarea/textarea.controller.js
index 60d762738f..4934adb5dd 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textarea/textarea.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textarea/textarea.controller.js
@@ -13,25 +13,11 @@ function textAreaController($scope) {
     $scope.model.maxlength = false;
     if ($scope.model.config && $scope.model.config.maxChars) {
         $scope.model.maxlength = true;
-        if($scope.model.value == undefined) {
-            $scope.model.count = ($scope.model.config.maxChars * 1);
-        } else {
-            $scope.model.count = ($scope.model.config.maxChars * 1) - $scope.model.value.length;
-        }
     }
-
-    $scope.model.change = function() {
-        if ($scope.model.config && $scope.model.config.maxChars) {
-            if($scope.model.value == undefined) {
-                $scope.model.count = ($scope.model.config.maxChars * 1);
-            } else {
-                $scope.model.count = ($scope.model.config.maxChars * 1) - $scope.model.value.length;
-            }
-            if($scope.model.count < 0) {
-                $scope.model.value = $scope.model.value.substring(0, ($scope.model.config.maxChars * 1));
-                $scope.model.count = 0;
-            }
-        }
+    
+    $scope.model.change = function () {
+        $scope.model.count = $scope.model.value.length;
     }
+    $scope.model.change();
 }
-angular.module('umbraco').controller("Umbraco.PropertyEditors.textAreaController", textAreaController);
\ No newline at end of file
+angular.module('umbraco').controller("Umbraco.PropertyEditors.textAreaController", textAreaController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textarea/textarea.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textarea/textarea.html
index 2fdca5d654..80da759fba 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textarea/textarea.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textarea/textarea.html
@@ -7,9 +7,12 @@
             <span class="help-inline" ng-message="valServer">{{textareaFieldForm.textarea.errorMsg}}</span>
         </span>
 
-        <div class="help" ng-if="model.maxlength">
-            <strong>{{model.count}}</strong>
-            <localize key="textbox_characters_left">characters left</localize>
+        <div class="help" ng-if="model.maxlength === true && model.count >= (model.config.maxChars*.8) && model.count <= model.config.maxChars">
+            <localize key="textbox_characters_left" tokens="[model.count, model.config.maxChars]">characters left</localize>
         </div>
+        <div class="help text-error" ng-if="model.maxlength === true && model.count > model.config.maxChars">
+            <localize key="textbox_characters_exceed" tokens="[model.count, model.config.maxChars]">Maximum {0} characters ({1} too many)</localize>
+        </div>
+
     </ng-form>
 </div>
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textbox/textbox.controller.js b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textbox/textbox.controller.js
index 734903e46c..4ab827db59 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textbox/textbox.controller.js
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textbox/textbox.controller.js
@@ -4,39 +4,18 @@ function textboxController($scope) {
     if (!$scope.model.config) {
         $scope.model.config = {};
     }
-
-    $scope.model.maxlength = false;
-    if ($scope.model.config && $scope.model.config.maxChars) {
-        $scope.model.maxlength = true;
-    }
-
+    
     if (!$scope.model.config.maxChars) {
         // 500 is the maximum number that can be stored
         // in the database, so set it to the max, even
         // if no max is specified in the config
         $scope.model.config.maxChars = 500;
     }
-
-    if ($scope.model.maxlength) {
-        if ($scope.model.value === undefined) {
-            $scope.model.count = ($scope.model.config.maxChars * 1);
-        } else {
-            $scope.model.count = ($scope.model.config.maxChars * 1) - $scope.model.value.length;
-        }
-    }
-
+    
     $scope.model.change = function () {
-        if ($scope.model.config && $scope.model.config.maxChars) {
-            if ($scope.model.value === undefined) {
-                $scope.model.count = ($scope.model.config.maxChars * 1);
-            } else {
-                $scope.model.count = ($scope.model.config.maxChars * 1) - $scope.model.value.length;
-            }
-            if ($scope.model.count < 0) {
-                $scope.model.value = $scope.model.value.substring(0, ($scope.model.config.maxChars * 1));
-                $scope.model.count = 0;
-            }
-        }
+        $scope.model.count = $scope.model.value.length;
     }
+    $scope.model.change();
+    
 }
 angular.module('umbraco').controller("Umbraco.PropertyEditors.textboxController", textboxController);
diff --git a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textbox/textbox.html b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textbox/textbox.html
index 6f6ed6bdf6..0e041e7f34 100644
--- a/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textbox/textbox.html
+++ b/src/Umbraco.Web.UI.Client/src/views/propertyeditors/textbox/textbox.html
@@ -12,9 +12,12 @@
             <span class="help-inline" ng-message="required"><localize key="general_required">Required</localize></span>
         </span>
 
-        <div class="help" ng-if="model.maxlength">
-            <strong>{{model.count}}</strong>
-            <localize key="textbox_characters_left">characters left</localize>
+        <div class="help" ng-if="model.count >= (model.config.maxChars*.8) && model.count <= model.config.maxChars">
+            <localize key="textbox_characters_left" tokens="[model.count, model.config.maxChars]">characters left</localize>
         </div>
+        <div class="help text-error" ng-if="model.count > model.config.maxChars">
+            <localize key="textbox_characters_exceed" tokens="[model.count, model.config.maxChars]">Maximum {0} characters ({1} too many)</localize>
+        </div>
+
     </ng-form>
 </div>
diff --git a/src/Umbraco.Web.UI/Umbraco/config/lang/da.xml b/src/Umbraco.Web.UI/Umbraco/config/lang/da.xml
index 875948d4d2..11dcd6ac57 100644
--- a/src/Umbraco.Web.UI/Umbraco/config/lang/da.xml
+++ b/src/Umbraco.Web.UI/Umbraco/config/lang/da.xml
@@ -1568,8 +1568,9 @@ Mange hilsner fra Umbraco robotten
   <area alias="emptyStates">
     <key alias="emptyDictionaryTree">Ingen ordbog elementer at vælge imellem</key>
   </area>
-  <area alias="textbox">
-    <key alias="characters_left">Karakterer tilbage</key>
+  <area alias="textbox">
+    <key alias="characters_left">><![CDATA[<strong>{0}</strong> tegn tilbage.]]></key>
+    <key alias="characters_exceed"><![CDATA[Maksimum {0} tegn, <strong>{1}</strong> for mange.]]></key>
   </area>
   <area alias="recycleBin">
     <key alias="contentTrashed">Slettet indhold med Id: {0} Relateret til original "parent" med id: {1}</key>
diff --git a/src/Umbraco.Web.UI/Umbraco/config/lang/en.xml b/src/Umbraco.Web.UI/Umbraco/config/lang/en.xml
index fa6f689845..d10bc6ea0c 100644
--- a/src/Umbraco.Web.UI/Umbraco/config/lang/en.xml
+++ b/src/Umbraco.Web.UI/Umbraco/config/lang/en.xml
@@ -2078,8 +2078,9 @@ To manage your website, simply open the Umbraco back office and start adding con
   <area alias="emptyStates">
     <key alias="emptyDictionaryTree">No Dictionary items to choose from</key>
   </area>
-  <area alias="textbox">
-    <key alias="characters_left">characters left</key>
+  <area alias="textbox">
+    <key alias="characters_left">><![CDATA[<strong>{0}</strong> characters left.]]></key>
+    <key alias="characters_exceed"><![CDATA[Maximum {0} characters, <strong>{1}</strong> too many.]]></key>
   </area>
   <area alias="recycleBin">
     <key alias="contentTrashed">Trashed content with Id: {0} related to original parent content with Id: {1}</key>
diff --git a/src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml b/src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml
index 6ff4d32f08..c04f639c3a 100644
--- a/src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml
+++ b/src/Umbraco.Web.UI/Umbraco/config/lang/en_us.xml
@@ -2090,8 +2090,9 @@ To manage your website, simply open the Umbraco back office and start adding con
   <area alias="emptyStates">
     <key alias="emptyDictionaryTree">No Dictionary items to choose from</key>
   </area>
-  <area alias="textbox">
-    <key alias="characters_left">characters left</key>
+  <area alias="textbox">
+    <key alias="characters_left">><![CDATA[<strong>{0}</strong> characters left.]]></key>
+    <key alias="characters_exceed"><![CDATA[Maximum {0} characters, <strong>{1}</strong> too many.]]></key>
   </area>
   <area alias="recycleBin">
     <key alias="contentTrashed">Trashed content with Id: {0} related to original parent content with Id: {1}</key>