diff --git a/bumblebee/output.py b/bumblebee/output.py
index f7c952f..10c13e0 100644
--- a/bumblebee/output.py
+++ b/bumblebee/output.py
@@ -249,9 +249,20 @@ class I3BarOutput(object):
             if not any(state in widget.state() for state in ["warning", "critical"]):
                 return
         padding = self._theme.padding(widget)
+
         prefix = self._theme.prefix(widget, padding)
         suffix = self._theme.suffix(widget, padding)
 
+        if self._config.markup() == "pango":
+            # add prefix/suffix colors
+            fg = self._theme.prefix_fg(widget)
+            bg = self._theme.prefix_bg(widget)
+            prefix = "<span {} {}>{}</span>".format(
+                "foreground='{}'".format(fg) if fg else "",
+                "background='{}'".format(bg) if bg else "",
+                prefix
+            )
+
         if prefix:
             full_text = u"{}{}".format(prefix, full_text)
         if suffix:
diff --git a/bumblebee/theme.py b/bumblebee/theme.py
index 3d5b114..2b52f73 100644
--- a/bumblebee/theme.py
+++ b/bumblebee/theme.py
@@ -118,6 +118,22 @@ class Theme(object):
         pre = self._get(widget, "prefix", None)
         return u"{}{}{}".format(padding, pre, padding) if pre else default
 
+    def prefix_fg(self, widget):
+        """Return the foreground color for the prefix"""
+        return self._get(widget, "prefixfg", None)
+
+    def prefix_bg(self, widget):
+        """Return the background color for the prefix"""
+        return self._get(widget, "prefixbg", None)
+
+    def suffix_fg(self, widget):
+        """Return the foreground color for the suffix"""
+        return self._get(widget, "suffixfg", None)
+
+    def suffix_bg(self, widget):
+        """Return the background color for the suffix"""
+        return self._get(widget, "suffixbg", None)
+
     def symbol(self, widget, name, default=None):
         return self._get(widget, name, default)