diff --git a/app/styles/app/layouts/build-job.sass b/app/styles/app/layouts/build-job.sass
index 344469dc..22831b85 100644
--- a/app/styles/app/layouts/build-job.sass
+++ b/app/styles/app/layouts/build-job.sass
@@ -50,6 +50,8 @@
       width: 1.4em
     .icon--env
       width: 1.1em
+    .icon.api
+      height: 1.5em
 
   @media #{$medium-up}
     height: 36px
diff --git a/app/styles/app/modules/icons.sass b/app/styles/app/modules/icons.sass
index 90c89c65..f10322c2 100644
--- a/app/styles/app/modules/icons.sass
+++ b/app/styles/app/modules/icons.sass
@@ -88,6 +88,12 @@
 .icon--grey.pull_request
   background-image: inline-image('svg/icon-request-pull.svg')
 
+.icon-api,
+.icon.api
+  background-image: inline-image('svg/api-white.svg')
+.icon--grey.api
+  background-image: inline-image('svg/api-light-grey.svg')
+
 .icon-lock
   background-image: inline-image('dashboard/private-icon.svg')
 
diff --git a/app/styles/app/modules/tiles.sass b/app/styles/app/modules/tiles.sass
index ad7e284c..d3c9fd4d 100644
--- a/app/styles/app/modules/tiles.sass
+++ b/app/styles/app/modules/tiles.sass
@@ -105,21 +105,22 @@
   height: 100%
   border-top-left-radius: 4px
   border-bottom-left-radius: 4px
-  .icon-status
+  .icon
     display: block
+  .icon-status
     width: 1.1em
     height: 1.2em
     margin: .7em auto 1em
   .icon.push
-    display: block
     width: 1.4em
     height: 1.1em
     margin: -0.2em auto 0
   .icon.pull_request
-    display: block
     width: 1.1em
     height: 1.6em
     margin: -0.5em auto 0
+  .icon.api
+    margin: -0.4em 0.75em
   .icon--job
     @extend %absolute-center
 
@@ -154,6 +155,8 @@
       white-space: nowrap
     @media #{$xlarge-up}
       @include grid-column(5)
+  .icon.api
+    margin: -0.2em 0.75em
 
 p.tile-single-line
   padding: .7em 0
diff --git a/app/templates/build.hbs b/app/templates/build.hbs
index 398a5e2b..8e42bc9c 100644
--- a/app/templates/build.hbs
+++ b/app/templates/build.hbs
@@ -3,8 +3,8 @@
 {{else}}
   <section {{bind-attr class=":tile :tile--pass :row build.state"}}>
     <div class="tile-status">
-      <span {{bind-attr class=":icon :icon-status build.state"}}></span>
-      <span {{bind-attr class=":request-kind build.eventType :icon"}}></span>
+      <span {{bind-attr class=":icon :icon-status build.state"}} {{bind-attr title="build.state"}}></span>
+      <span {{bind-attr class=":request-kind build.eventType :icon"}} {{bind-attr title="build.eventType"}}></span>
     </div>
 
     <div class="tile-main medium-8 columns">
diff --git a/app/templates/components/builds-item.hbs b/app/templates/components/builds-item.hbs
index eb6f3d65..ce555266 100644
--- a/app/templates/components/builds-item.hbs
+++ b/app/templates/components/builds-item.hbs
@@ -1,6 +1,6 @@
 <div class="tile-status">
-  <span class="icon icon-status {{build.state}}"></span>
-  <span class="request-kind icon {{build.eventType}}"></span>
+  <span class="icon icon-status {{build.state}}" title="{{build.state}}"></span>
+  <span class="request-kind icon {{build.eventType}}" title="{{build.eventType}}"></span>
 </div>
 
 <div class="column tile-main medium-6">
diff --git a/app/templates/job.hbs b/app/templates/job.hbs
index 81b394e8..d1c83dea 100644
--- a/app/templates/job.hbs
+++ b/app/templates/job.hbs
@@ -2,8 +2,8 @@
 
 <section {{bind-attr class=":tile :tile--pass :row job.state"}} {{!-- id="new-summary" --}}>
   <div class="tile-status">
-    <span {{bind-attr class=":icon :icon-status job.state"}}></span>
-    <span {{bind-attr class=":request-kind job.build.eventType :icon"}}></span>
+    <span {{bind-attr class=":icon :icon-status job.state"}} {{bind-attr title="job.state"}}></span>
+    <span {{bind-attr class=":request-kind job.build.eventType :icon"}} {{bind-attr title="job.build.eventType"}}></span>
   </div>
 
   <div class="tile-main medium-8 columns">
diff --git a/public/images/svg/api-dark-grey.svg b/public/images/svg/api-dark-grey.svg
new file mode 100644
index 00000000..72d4c7f9
--- /dev/null
+++ b/public/images/svg/api-dark-grey.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 17 12.3" enable-background="new 0 0 17 12.3" xml:space="preserve">
+<path fill="#969496" d="M16,3.2h-1.4v-2c0-0.6-0.4-1.1-1-1.1h-3.1c-0.5,0-1,0.5-1,1.1v2H7.2v-2c0-0.6-0.4-1.1-1-1.1H3.2
+	c-0.5,0-1,0.5-1,1.1v2H1c-0.5,0-1,0.5-1,1.1v6.8c0,0.6,0.4,1.1,1,1.1H16c0.5,0,1-0.5,1-1.1V4.3C17,3.7,16.6,3.2,16,3.2z"/>
+</svg>
diff --git a/public/images/svg/api-light-grey.svg b/public/images/svg/api-light-grey.svg
new file mode 100644
index 00000000..2fa4e7dc
--- /dev/null
+++ b/public/images/svg/api-light-grey.svg
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 16.0.4, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 width="144.57px" height="215.43px" viewBox="0 0 144.57 215.43" enable-background="new 0 0 144.57 215.43" xml:space="preserve">
+<path fill="#D0CFCE" d="M136.066,82.628H124.16V65.619c0-5.103-3.401-9.354-8.504-9.354H89.293c-4.252,0-8.504,4.252-8.504,9.354
+	v17.009H61.23V65.619c0-5.103-3.402-9.354-8.504-9.354H27.213c-4.252,0-8.504,4.252-8.504,9.354v17.009H8.504
+	C4.252,82.628,0,86.88,0,91.983v57.828c0,5.103,3.402,9.354,8.504,9.354h127.562c4.252,0,8.504-4.252,8.504-9.354V91.983
+	C144.57,86.88,141.168,82.628,136.066,82.628z"/>
+</svg>
diff --git a/public/images/svg/api-white.svg b/public/images/svg/api-white.svg
new file mode 100644
index 00000000..3956236f
--- /dev/null
+++ b/public/images/svg/api-white.svg
@@ -0,0 +1,7 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 18.1.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
+	 viewBox="0 0 17 12.3" enable-background="new 0 0 17 12.3" xml:space="preserve">
+<path fill="#FFFFFF" d="M16,3.2h-1.4v-2c0-0.6-0.4-1.1-1-1.1h-3.1c-0.5,0-1,0.5-1,1.1v2H7.2v-2c0-0.6-0.4-1.1-1-1.1H3.2
+	c-0.5,0-1,0.5-1,1.1v2H1c-0.5,0-1,0.5-1,1.1v6.8c0,0.6,0.4,1.1,1,1.1H16c0.5,0,1-0.5,1-1.1V4.3C17,3.7,16.6,3.2,16,3.2z"/>
+</svg>