diff --git a/gitinspector/html/html.header b/gitinspector/html/html.header
index 6ab9b01..acf5aab 100644
--- a/gitinspector/html/html.header
+++ b/gitinspector/html/html.header
@@ -161,6 +161,36 @@
 				}});
 
 				blame_plot.draw();
+
+				// Color in metrics levels.
+
+				$("div#metrics div div").each(function() {{
+					var rgb = $(this).css("background-color").match(/\d+/g);
+					rgb[0] = parseInt(rgb[0]);
+					rgb[1] = parseInt(rgb[1]);
+					rgb[2] = parseInt(rgb[2]);
+
+					if ($(this).hasClass("minimal")) {{
+						rgb[0] -= 10;
+						rgb[1] += 10;
+						rgb[2] -= 10;
+					}} else if ($(this).hasClass("minor")) {{
+						rgb[1] += 10;
+					}} else if ($(this).hasClass("medium")) {{
+						rgb[0] += 10;
+						rgb[1] += 10;
+					}} else if ($(this).hasClass("bad")) {{
+						rgb[0] += 10;
+						rgb[1] -= 10;
+						rgb[2] -= 10;
+					}} else if ($(this).hasClass("severe")) {{
+						rgb[0] += 20;
+						rgb[1] -= 20;
+						rgb[2] -= 20;
+					}}
+
+					$(this).css("background-color", "rgb(" + rgb[0] + "," + rgb[1] + "," + rgb[2] + ")");
+				}});
 			}});
 		</script>
 		<style type="text/css">
@@ -272,6 +302,9 @@
 				padding: 0.5em 0.2em;
 				width: auto;
 			}}
+			div#metrics div {{
+				background-color: #eee;
+			}}
 			div#responsibilities div.odd, div#metrics div.odd {{
 				background-color: #dbdbdb;
 			}}
diff --git a/gitinspector/metrics.py b/gitinspector/metrics.py
index dfb1c54..3770a13 100644
--- a/gitinspector/metrics.py
+++ b/gitinspector/metrics.py
@@ -118,6 +118,13 @@ CYCLOMATIC_COMPLEXITY_TEXT = N_("The following files have an elevated cyclomatic
 CYCLOMATIC_COMPLEXITY_DENSITY_TEXT = N_("The following files have an elevated cyclomatic complexity density (in order of severity)")
 METRICS_MISSING_INFO_TEXT = N_("No metrics violations were found in the repository")
 
+METRICS_VIOLATION_SCORES = [[1.0, "minimal"], [1.25, "minor"], [1.5, "medium"], [2.0, "bad"], [3.0, "severe"]]
+
+def __get_metrics_score__(ceiling, value):
+	for i in reversed(METRICS_VIOLATION_SCORES):
+		if value > ceiling * i[0]:
+			return i[1]
+
 class Metrics(Outputable):
 	def output_text(self):
 		metrics_logic = MetricsLogic()
@@ -150,21 +157,24 @@ class Metrics(Outputable):
 		if metrics_logic.eloc:
 			metrics_xml += "<div><h4>" + _(ELOC_INFO_TEXT) + ".</h4>"
 			for n, i in enumerate(sorted(set([(j, i) for (i, j) in metrics_logic.eloc.items()]), reverse = True)):
-				metrics_xml += "<div" + (" class=\"odd\">" if n % 2 == 1 else ">") + \
+				metrics_xml += "<div class=\"" + __get_metrics_score__(__metric_eloc__[FileDiff.get_extension(i[1])], i[0]) + \
+				               (" odd\">" if n % 2 == 1 else "\">") + \
 				               _("{0} ({1} estimated lines of code)").format(i[1], str(i[0])) + "</div>"
 			metrics_xml += "</div>"
 
 		if metrics_logic.cyclomatic_complexity:
 			metrics_xml += "<div><h4>" +  _(CYCLOMATIC_COMPLEXITY_TEXT) + "</h4>"
 			for n, i in enumerate(sorted(set([(j, i) for (i, j) in metrics_logic.cyclomatic_complexity.items()]), reverse = True)):
-				metrics_xml += "<div" + (" class=\"odd\">" if n % 2 == 1 else ">") + \
+				metrics_xml += "<div class=\"" + __get_metrics_score__(METRIC_CYCLOMATIC_COMPLEXITY_THRESHOLD, i[0]) + \
+				               (" odd\">" if n % 2 == 1 else "\">") + \
 				               _("{0} ({1} in cyclomatic complexity)").format(i[1], str(i[0])) + "</div>"
 			metrics_xml += "</div>"
 
 		if metrics_logic.cyclomatic_complexity_density:
 			metrics_xml += "<div><h4>" +  _(CYCLOMATIC_COMPLEXITY_DENSITY_TEXT) + "</h4>"
 			for n, i in enumerate(sorted(set([(j, i) for (i, j) in metrics_logic.cyclomatic_complexity_density.items()]), reverse = True)):
-				metrics_xml += "<div" + (" class=\"odd\">" if n % 2 == 1 else ">") + \
+				metrics_xml += "<div class=\"" + __get_metrics_score__(METRIC_CYCLOMATIC_COMPLEXITY_DENSITY_THRESHOLD, i[0]) + \
+				               (" odd\">" if n % 2 == 1 else "\">") + \
 				               _("{0} ({1:.3f} in cyclomatic complexity density)").format(i[1], i[0]) + "</div>"
 			metrics_xml += "</div>"