diff --git a/icon-font/template.jst.ejs b/icon-font/template.jst.ejs
index 546a4d5..d52b624 100644
--- a/icon-font/template.jst.ejs
+++ b/icon-font/template.jst.ejs
@@ -1,6 +1,8 @@
 // Icon font elements
 // ----------------------------------------------
 
+@import "cdb-variables/sizes";
+
 @font-face {
   font-family: 'CartoIcon';
   src: url('../fonts/cartoIcon.eot');
diff --git a/src/fonts/cartoIcon.eot b/src/fonts/cartoIcon.eot
index c199ab9..167c203 100644
Binary files a/src/fonts/cartoIcon.eot and b/src/fonts/cartoIcon.eot differ
diff --git a/src/fonts/cartoIcon.ttf b/src/fonts/cartoIcon.ttf
index a894c41..4b28d5d 100644
Binary files a/src/fonts/cartoIcon.ttf and b/src/fonts/cartoIcon.ttf differ
diff --git a/src/fonts/cartoIcon.woff b/src/fonts/cartoIcon.woff
index b6857c0..4e85c1e 100644
Binary files a/src/fonts/cartoIcon.woff and b/src/fonts/cartoIcon.woff differ
diff --git a/src/scss/icon-font.css.scss b/src/scss/icon-font.css.scss
index ddeeef6..14b5258 100644
--- a/src/scss/icon-font.css.scss
+++ b/src/scss/icon-font.css.scss
@@ -1,6 +1,8 @@
 // Icon font elements
 // ----------------------------------------------
 
+@import "cdb-variables/sizes";
+
 @font-face {
   font-family: 'CartoIcon';
   src: url('../fonts/cartoIcon.eot');
@@ -22,6 +24,16 @@
   line-height: 1;
 }
 
+.CDB-IconFont--center {
+  vertical-align: middle;
+}
+.CDB-IconFont--top {
+  vertical-align: top;
+}
+.CDB-IconFont--small {
+  font-size: $sFontSize-small + 1;
+}
+
 /* SG
 # Typography/Icon font
 All available icons in CartoDB.