diff --git a/dev/demo/taggerdemo.js b/dev/demo/taggerdemo.js
index f0da311..f30c23a 100644
--- a/dev/demo/taggerdemo.js
+++ b/dev/demo/taggerdemo.js
@@ -9,9 +9,7 @@
 
 require(['tagger', 'lib/domReady'], function (tagger, domReady) {
   domReady(function(){
-    console.log('Hey');
-    var t = document.getElementById('tagger');
-    gTagger = tagger.create(t);
+    gTagger = tagger.create(document.getElementById('tagger'));
   });
 });
 
diff --git a/dev/js/src/init.js b/dev/js/src/init.js
index 9aa410d..1ead697 100644
--- a/dev/js/src/init.js
+++ b/dev/js/src/init.js
@@ -8,6 +8,7 @@
   'vc/array',
   'lib/alertify',
   'session',
+  'tagger',
   'api',
   'mailToChiffre',
   'lib/highlight/highlight.pack',
@@ -20,7 +21,8 @@
 	     hintArray,
 	     vcArray,
 	     alertifyClass,
-	     sessionClass) {
+	     sessionClass,
+	     tagger) {
 
   // Set hint array for hint helper
   KorAP.hintArray = hintArray;
diff --git a/dev/js/src/palette.js b/dev/js/src/palette.js
new file mode 100644
index 0000000..8c9f3fa
--- /dev/null
+++ b/dev/js/src/palette.js
@@ -0,0 +1,80 @@
+define(['util'],function () {
+  /*
+   * Created with http://tools.medialab.sciences-po.fr/iwanthue/
+   * and H: 0-360, C: 0.4-2.1, L: 0.7-1.5, 64 colors
+   */
+  var palette = [
+    '9C8AC7',
+    '6DED31',
+    'DF7F23',
+    '5AECD1',
+    'F54597',
+    'D4D275',
+    'E6A8A1',
+    '67E682',
+    '719A93',
+    'E67AE6',
+    'E8F03F',
+    'F45042',
+    '6D9C25',
+    'D0C3D9',
+    'E37076',
+    '509A58',
+    'BE9962',
+    'D88AB6',
+    '71ABCE',
+    '62DCEB',
+    'D4B73C',
+    'A0E5B0',
+    '5BBB26',
+    'A7E230',
+    '7E8EEA',
+    'D1856B',
+    '59E9A9',
+    'F24A61',
+    'A6D455',
+    'AEE38B',
+    '4DA385',
+    '999C46',
+    'AFDDDE',
+    'BA85E0',
+    'B68C31',
+    '8AA46C',
+    'D9874C',
+    'A18EA8',
+    'E56BAC',
+    'ECA72F',
+    '3AE152',
+    '5B9EDF',
+    'E9672F',
+    '43B046',
+    'E96D59',
+    'D6B3E6',
+    'E6BB6A',
+    '92C5A9',
+    'BE7C85',
+    '9C9B1E',
+    'CCD896',
+    '84E861',
+    'DA7093',
+    'DDEA6F',
+    'BCC92E',
+    '59C9BD',
+    '52A8B0',
+    '51BC7C',
+    '7EB051',
+    'F0D036',
+    'D970C5',
+    'E95F7D',
+    'EF9798',
+    'ED5490'
+  ];
+
+  KorAP.Palette = {
+    getC : function (index) {
+      return '#' + palette[index % 64];
+    }
+  };
+
+  return KorAP.Palette;
+});
diff --git a/dev/js/src/tagger.js b/dev/js/src/tagger.js
index dc7be4d..4ff7c03 100644
--- a/dev/js/src/tagger.js
+++ b/dev/js/src/tagger.js
@@ -1,10 +1,11 @@
-define([], function () {
+define(['palette'], function (p) {
 
   // "use strict";
 
   return {
     create : function (elem) {
       var obj = Object.create(this);
+      obj._nr = 0;
       obj._elem = elem;
       elem.appendChild(
 	document.createElement('div')
@@ -25,8 +26,12 @@
 
       obj._cat = [];
     },
+
     addTag : function (name) {
       this._cat.push(name);
+
+      this._nr++;
+
       var cat = document.createElement('span');
       cat.appendChild(
 	document.createTextNode(name)
@@ -34,6 +39,9 @@
       cat.appendChild(
 	document.createElement('span')
       ).setAttribute('class','close');
+
+      cat.style.backgroundColor = p.getC(this._nr);
+
       this._elem.firstChild.appendChild(cat);
     }
   };
diff --git a/dev/scss/main/tagger.scss b/dev/scss/main/tagger.scss
index f794f0e..c3a08be 100644
--- a/dev/scss/main/tagger.scss
+++ b/dev/scss/main/tagger.scss
@@ -2,6 +2,7 @@
 @import "../util";
 
 $border-size: 1px;
+$tagcolor: rgba(0,0,0,0.5);
 
 .tagger {
   display: table;
@@ -18,23 +19,30 @@
 
     // The tag
     > span {
+      font-size: 80%;
       display: inline-block;
       white-space: nowrap;
       background-color: $dark-orange;
-      padding: 0 4px;
-      color: rgba(0,0,0,0.3);
+      padding: 2px 6px;
+      color: $tagcolor;
+      text-shadow: 1px 1px 0px rgba(255,255,255,0.3);
       margin-right: 2px;
       box-shadow: $choose-box-shadow;
-      border: $choose-border;
-      border-radius: $standard-border-radius;
-
+      cursor: pointer;
+      border: {
+	width: $border-size;
+	style:solid;
+	color: rgba(0,0,0,0.3);
+	radius: $standard-border-radius;
+      }
       > span {
-	cursor: pointer;
+	cursor: crosshair;
 	&::after {
 	  font-size: 70%;
 	  vertical-align: top;
-	  margin-left: 2px;
-	  color: rgba(0,0,0,0.2);
+	  padding-left: 3px;
+	  color: $tagcolor;
+	  text-shadow: none;
 	  font-family: 'FontAwesome';
 	  content: $fa-close;
 	}