diff --git a/_data/nutrients.yml b/_data/nutrients.yml
index f1e72cc82..01a0f9bfe 100644
--- a/_data/nutrients.yml
+++ b/_data/nutrients.yml
@@ -24,6 +24,8 @@ fatContent:
   type: Mass
   description: The number of grams of fat.
   unit: g
+  low: 3
+  high: 17.5
 fiberContent:
   name: fiber
   type: Mass
@@ -39,16 +41,22 @@ saturatedFatContent:
   type: Mass
   description: The number of grams of saturated fat.
   unit: g
+  low: 1.5
+  high: 5
 sodiumContent:
   name: sodium
   type: Mass
   description: The number of milligrams of sodium.
   unit: mg
+  low: 140
+  high: 400
 sugarContent:
   name: sugar
   type: Mass
   description: The number of grams of sugar.
   unit: g
+  low: 5
+  high: 22.5
 transFatContent:
   name: trans fat
   type: Mass
diff --git a/_includes/nutritional-information.html b/_includes/nutritional-information.html
index 6477cf75f..fd7e0a114 100644
--- a/_includes/nutritional-information.html
+++ b/_includes/nutritional-information.html
@@ -12,8 +12,13 @@ <h4 class="blue mt0 mb2 xs-center">Nutritional Information
   {% assign name = site.data.nutrients[itemprop].name %}
   {% assign value = nutrient.last %}
   {% assign unit = site.data.nutrients[itemprop].unit %}
-  <div  class="rounded center border border-1 border-gray sm-col sm-col-2 lg-col-1 mr1 mb1">
-    <h5 class="bg-gray white m0 p1 capitalize">{{ name  }}</h5>
+  {% assign low = site.data.nutrients[itemprop].low %}
+  {% assign high = site.data.nutrients[itemprop].high %}
+  {% assign colour = 'gray' %}
+  {% if value <= low %}{% assign colour = 'olive' %}{% endif %}
+  {% if value >= high %}{% assign colour = 'orange' %}{% endif %}
+  <div  class="rounded center border border-1 border-{{ colour }} sm-col sm-col-2 lg-col-2 mr1 mb1">
+    <h5 class="bg-{{ colour }} white m0 p1 capitalize">{{ name  }}</h5>
     <p itemprop="{{ itemprop }}">{{ value }}{{ unit }}</p>
   </div>
   {% endfor %}