diff --git a/client/cryps.css b/client/cryps.css
index 634aebe7..a9538803 100644
--- a/client/cryps.css
+++ b/client/cryps.css
@@ -220,6 +220,16 @@ header {
     stroke-width: 4px;
     stroke-dasharray: 121, 242;
     animation: saw 2s infinite linear;
+
+    transition-property: stroke-color;
+    transition-duration: 0.5s;
+    transition-timing-function: ease;
+}
+
+.ping-text {
+    margin-left: 1em;
+    min-width: 2em;
+    display: inline-block;
 }
 
 @keyframes saw {
diff --git a/client/src/actions.jsx b/client/src/actions.jsx
index 0e12ec2f..5bd8654f 100644
--- a/client/src/actions.jsx
+++ b/client/src/actions.jsx
@@ -13,6 +13,9 @@ export const setInstance = value => ({ type: SET_INSTANCE, value });
 export const SET_PLAYER = 'SET_PLAYER';
 export const setPlayer = value => ({ type: SET_PLAYER, value });
 
+export const SET_PING = 'SET_PING';
+export const setPing = value => ({ type: SET_PING, value });
+
 export const SET_GAME = 'SET_GAME';
 export const setGame = value => ({ type: SET_GAME, value });
 
diff --git a/client/src/components/header.component.jsx b/client/src/components/header.component.jsx
index 57c1ae4d..f6cc34a4 100644
--- a/client/src/components/header.component.jsx
+++ b/client/src/components/header.component.jsx
@@ -3,12 +3,20 @@ const preact = require('preact');
 
 const { saw } = require('./shapes');
 
+function pingColour(ping) {
+    if (ping < 100) return 'forestgreen';
+    if (ping < 200) return 'yellow';
+    return 'red';
+}
+
 function renderHeader(args) {
-    const { account } = args;
+    const { account, ping } = args;
+
     const accountStatus = account ?
         (<div className="header-status">
             <h1 className="header-username">{account.name}</h1>
-            {saw('stat-icon')}
+            {saw(pingColour(ping))}
+            <div className="ping-text">{ping}ms</div>
         </div>)
         : '';
 
diff --git a/client/src/components/header.container.jsx b/client/src/components/header.container.jsx
index df1da5f9..a9a27313 100644
--- a/client/src/components/header.container.jsx
+++ b/client/src/components/header.container.jsx
@@ -3,8 +3,8 @@ const { connect } = require('preact-redux');
 const Header = require('./header.component');
 
 const addState = connect(
-    ({ account }) => {
-        return { account };
+    ({ account, ping }) => {
+        return { account, ping };
     },
 );
 
diff --git a/client/src/components/svgs/saw.jsx b/client/src/components/svgs/saw.jsx
index 2e615897..3433c18e 100644
--- a/client/src/components/svgs/saw.jsx
+++ b/client/src/components/svgs/saw.jsx
@@ -3,8 +3,8 @@ const preact = require('preact');
 module.exports = function saw(colour) {
     return (
         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" style={{ stroke: colour }}>
-          <path d="M0,50l50,-50v100l50,-50" className="ping-path"/>
-          <path d="M0,50l50,-50v100l50,-50" className="ping-path"/>
+            <path d="M0,50l50,-50v100l50,-50" className="ping-path"/>
+            <path d="M0,50l50,-50v100l50,-50" className="ping-path"/>
         </svg>
     );
 };
diff --git a/client/src/events.jsx b/client/src/events.jsx
index b3781897..3a2a1613 100644
--- a/client/src/events.jsx
+++ b/client/src/events.jsx
@@ -1,7 +1,6 @@
 const toast = require('izitoast');
 const eachSeries = require('async/eachSeries');
 const anime = require('animejs').default;
-const range = require('lodash/range');
 
 const actions = require('./actions');
 const { TIMES } = require('./constants');
@@ -11,7 +10,7 @@ function registerEvents(store) {
 
     // timeout handlers
     store.subscribe(() => {
-        const { game, instance, cryps, ws} = store.getState();
+        const { game, instance, cryps, ws } = store.getState();
 
         if (!game) ws.clearGameStateTimeout();
         if (!instance) ws.clearInstanceStateTimeout();
@@ -25,9 +24,10 @@ function registerEvents(store) {
         return anime({
             targets: 'img',
             translateX: () => anime.random(-20, 20),
-            translateY: () => anime.random(-20, 20),
+            translateY: () => anime.random(0, 40),
             rotate: () => anime.random(-35, 35),
             duration: () => anime.random(5000, 6000),
+            delay: () => anime.random(0, 1000),
             direction: 'alternate',
             easing: 'linear',
             loop: true,
@@ -36,6 +36,10 @@ function registerEvents(store) {
     setInterval(crypAnimations, 5000);
     crypAnimations();
 
+    function setPing(ping) {
+       store.dispatch(actions.setPing(ping));
+    }
+
     function setCryps(cryps) {
         console.log('EVENT ->', 'cryps', cryps);
     }
@@ -287,6 +291,7 @@ function registerEvents(store) {
         setWs,
         setGameList,
         setZone,
+        setPing,
         setScores,
     };
 }
diff --git a/client/src/main.jsx b/client/src/main.jsx
index 0d20257a..81f3da17 100644
--- a/client/src/main.jsx
+++ b/client/src/main.jsx
@@ -28,6 +28,7 @@ const store = createStore(
         info: reducers.infoReducer,
         instance: reducers.instanceReducer,
         player: reducers.playerReducer,
+        ping: reducers.pingReducer,
         instances: reducers.instancesReducer,
         reclaiming: reducers.reclaimingReducer,
         selectedCryps: reducers.selectedCrypsReducer,
diff --git a/client/src/reducers.jsx b/client/src/reducers.jsx
index f5c49c94..cb4197cb 100644
--- a/client/src/reducers.jsx
+++ b/client/src/reducers.jsx
@@ -10,6 +10,16 @@ function accountReducer(state = defaultAccount, action) {
     }
 }
 
+const defaultPing = null;
+function pingReducer(state = defaultPing, action) {
+    switch (action.type) {
+        case actions.SET_PING:
+            return action.value;
+        default:
+            return state;
+    }
+}
+
 const defaultActiveSkill = null;
 function activeSkillReducer(state = defaultActiveSkill, action) {
     switch (action.type) {
@@ -177,4 +187,5 @@ module.exports = {
     resolutionReducer,
     wsReducer,
     infoReducer,
+    pingReducer,
 };
diff --git a/client/src/socket.jsx b/client/src/socket.jsx
index 10d6494f..d6c818fc 100644
--- a/client/src/socket.jsx
+++ b/client/src/socket.jsx
@@ -28,8 +28,10 @@ function createSocket(events) {
     // -------------
     //   Outgoing
     // -------------
+    let ping = Date.now();
     function send(msg) {
         console.log('outgoing msg', msg);
+        ping = Date.now();
         msg.token = account && account.token && account.token;
         ws.send(cbor.encode(msg));
     }
@@ -281,6 +283,7 @@ function createSocket(events) {
         const { method, params } = res;
 
         console.log(res);
+        events.setPing(Date.now() - ping);
 
         // check for error and split into response type and data
         if (res.err) return errHandler(res.err);
diff --git a/server/src/cryp.rs b/server/src/cryp.rs
index 05e40c88..976b22b9 100644
--- a/server/src/cryp.rs
+++ b/server/src/cryp.rs
@@ -241,6 +241,10 @@ impl Cryp {
     }
 
     pub fn spec_add(&mut self, spec: Spec) -> Result<&mut Cryp, Error> {
+        if self.specs.len() >= 6 {
+            return Err(err_msg("maximum specs equipped"));
+        }
+
         self.specs.push(spec);
         return Ok(self.calculate_colours());
     }