diff --git a/lib/specifications/getProjectUsingGit.js b/lib/specifications/getProjectUsingGit.js
index dff730e..60b4780 100644
--- a/lib/specifications/getProjectUsingGit.js
+++ b/lib/specifications/getProjectUsingGit.js
@@ -18,7 +18,8 @@ module.exports = function getProject(repoUrl, repoName, localName) {
       repoName: repoName,
       repoUrl: repoUrl,
       localName: localName,
-      commit: sha
+      commit: sha,
+      shortCommit: sha.substring(0, 7) 
     };
   }
 
diff --git a/lib/specifications/projectMetaData.js b/lib/specifications/projectMetaData.js
index de58eab..8b8fb8c 100644
--- a/lib/specifications/projectMetaData.js
+++ b/lib/specifications/projectMetaData.js
@@ -37,6 +37,7 @@ function deriveProjectData(featureFileRoot, repoData) {
     name: repoData.repoName,
     url: repoData.repoUrl,
     commit: repoData.commit,
+    shortCommit: repoData.shortCommit,
     localName: repoData.localName,
     featureFilePaths: []
   }
diff --git a/public/css/features.css b/public/css/features.css
index 03590d6..d613319 100644
--- a/public/css/features.css
+++ b/public/css/features.css
@@ -1,32 +1,41 @@
-.project-name {
+.project-title {
   display: inline-block;
 }
-
 .quick-link {
   text-decoration: none;
+  color: blue;
 }
-
-.project-name .quick-link-arrow {
+.project-title .quick-link-icon {
+  font-size: 1.3em;
   opacity: 0.4;
+  color: blue;
 }
-.project-name:hover .quick-link-arrow {
+.project-title:hover .quick-link-icon {
   opacity: 1;
   color: green;
 }
+.project-name {
+  margin-left: 0.5em;
+}
+
+.project-commit {
+  margin-left: 0.3em;
+}
 
 .repo-link {
   position: relative;
   top: -0.1em;
   font-size: 0.7em;
-  margin-left: 1em;
+  margin-left: 2em;
   font-weight: bold;
   text-transform: uppercase;
 }
 .repo-link a {
   text-decoration: none;
+  color: blue;
 }
 .repo-link:hover a {
-  text-decoration: underline;
+  color: green;
 }
 
 .links-container {
diff --git a/views/features.hbs b/views/features.hbs
index 1624736..2f6ee28 100644
--- a/views/features.hbs
+++ b/views/features.hbs
@@ -7,10 +7,10 @@
   </header>
   {{#each projects}}
     <section class="project">
-      <h2 class="project-name" id={{this.name}}>
-        <a class="quick-link" href="#{{this.name}}"><span class="quick-link-arrow">&Rarr;</span> {{this.name}}</a>
+      <h2 class="project-title" id={{this.name}}>
+        <a class="quick-link" href="#{{this.name}}"><span class="quick-link-icon">&elsdot;</span><span class="project-name">{{this.name}}</span></a>
       </h2>
-      <span class="project-commit">&commat;{{this.commit}}</span>
+      <span class="project-commit">&commat;{{this.shortCommit}}</span>
       <span class="repo-link"><a href="{{this.url}}">(visit repository)</a></span>
       <div class="links-container">
         {{#each this.featureFilePaths}}