diff --git a/packages/nylas-api/serialization.js b/packages/nylas-api/serialization.js
index 68c77ddc8..77175001b 100644
--- a/packages/nylas-api/serialization.js
+++ b/packages/nylas-api/serialization.js
@@ -20,6 +20,8 @@ function jsonSchema(modelName) {
       connection_settings: Joi.object(),
       sync_policy: Joi.object(),
       sync_error: Joi.object().allow(null),
+      first_sync_completed_at: Joi.number().allow(null),
+      last_sync_completions: Joi.array(),
     })
   }
   if (modelName === 'Folder') {
diff --git a/packages/nylas-core/models/shared/account.js b/packages/nylas-core/models/shared/account.js
index be0014d7d..eb61379cf 100644
--- a/packages/nylas-core/models/shared/account.js
+++ b/packages/nylas-core/models/shared/account.js
@@ -12,6 +12,7 @@ module.exports = (sequelize, Sequelize) => {
     connectionCredentials: Sequelize.STRING,
     syncPolicy: JSONType('syncPolicy'),
     syncError: JSONType('syncError', {defaultValue: null}),
+    firstSyncCompletedAt: Sequelize.INTEGER,
     lastSyncCompletions: JSONARRAYType('lastSyncCompletions'),
   }, {
     classMethods: {
@@ -30,7 +31,8 @@ module.exports = (sequelize, Sequelize) => {
           connection_settings: this.connectionSettings,
           sync_policy: this.syncPolicy,
           sync_error: this.syncError,
-          lastSyncCompletions: this.lastSyncCompletions,
+          first_sync_completed_at: this.firstSyncCompletedAt,
+          last_sync_completions: this.lastSyncCompletions,
         }
       },
 
diff --git a/packages/nylas-dashboard/public/css/app.css b/packages/nylas-dashboard/public/css/app.css
index 7a6ea18f7..335e92347 100644
--- a/packages/nylas-dashboard/public/css/app.css
+++ b/packages/nylas-dashboard/public/css/app.css
@@ -2,6 +2,7 @@ body {
   background-image: -webkit-linear-gradient(top, rgba(232, 244, 250, 0.2), rgba(231, 231, 233, 1)), url(http://news.nationalgeographic.com/content/dam/news/2015/12/13/BookTalk%20K2/01BookTalkK2.jpg);
   background-size: cover;
   font-family: Roboto, sans-serif;
+  font-size: 12px;
 }
 
 h2 {
@@ -9,6 +10,10 @@ h2 {
   text-align: center;
 }
 
+pre {
+  margin: 0;
+}
+
 .account {
   display: inline-block;
   border-radius: 5px;
@@ -20,21 +25,21 @@ h2 {
 }
 
 .account h3 {
-  margin: 0; padding: 0;
+  font-size: 16px;
+  margin: 0;
+  padding: 0;
 }
 
 .account .section {
+  font-size: 14px;
+  padding: 10px 0;
   text-align: center;
 }
 
 .account.errored {
-  background-image: linear-gradient(to bottom,#f2dede 0,#e7c3c3 100%);
-  background-repeat: repeat-x;
-  border-color: #dca7a7;
-  border: 1px solid;
   color: #a94442;
   border-radius: 4px;
-  background-color: #f2dede;
+  background-color: rgba(231, 195, 195, 0.6);
 }
 
 .account .error pre {
diff --git a/packages/nylas-dashboard/public/js/app.jsx b/packages/nylas-dashboard/public/js/app.jsx
index c09831c2a..1cd49bc4b 100644
--- a/packages/nylas-dashboard/public/js/app.jsx
+++ b/packages/nylas-dashboard/public/js/app.jsx
@@ -13,7 +13,6 @@ class Account extends React.Component {
       }
       return (
         <div className="error">
-          <strong> Sync Errored: </strong>
           <pre>
             {JSON.stringify(error, null, 2)}
           </pre>
@@ -26,9 +25,9 @@ class Account extends React.Component {
   render() {
     const {account, assignment, active} = this.props;
     const errorClass = account.sync_error ? ' errored' : ''
-    const syncCompletions = []
-    for (const time of account.lastSyncCompletions) {
-      syncCompletions.push(
+    const lastSyncCompletions = []
+    for (const time of account.last_sync_completions) {
+      lastSyncCompletions.push(
         <div key={time}>{new Date(time).toString()}</div>
       )
     }
@@ -36,9 +35,16 @@ class Account extends React.Component {
       <div className={`account${errorClass}`}>
         <h3>{account.email_address} {active ? '🌕' : '🌑'}</h3>
         <strong>{assignment}</strong>
+        <div className="section">Sync Policy</div>
         <pre>{JSON.stringify(account.sync_policy, null, 2)}</pre>
-        <div className="section">Last Sync Completions</div>
-        <pre>{syncCompletions}</pre>
+        <div className="section">Sync Cycles</div>
+        <div>
+          <b>First Sync Completion</b>:
+          <pre>{new Date(account.first_sync_completed_at).toString()}</pre>
+        </div>
+        <div><b>Last Sync Completions:</b></div>
+        <pre>{lastSyncCompletions}</pre>
+        <div className="section">Error</div>
         {this.renderError()}
       </div>
     );
diff --git a/packages/nylas-sync/sync-worker.js b/packages/nylas-sync/sync-worker.js
index bf0fca5ef..9cae14fe8 100644
--- a/packages/nylas-sync/sync-worker.js
+++ b/packages/nylas-sync/sync-worker.js
@@ -182,6 +182,10 @@ class SyncWorker {
   onSyncDidComplete() {
     const {afterSync} = this._account.syncPolicy;
 
+    if (!this._account.firstSyncCompletedAt) {
+      this._account.firstSyncCompletedAt = Date.now()
+    }
+
     let lastSyncCompletions = [...this._account.lastSyncCompletions]
     lastSyncCompletions = [Date.now(), ...lastSyncCompletions]
     if (lastSyncCompletions.length > 10) {