diff --git a/src/app/appState.js b/src/app/appState.js
index 96e13ff..e34c4de 100644
--- a/src/app/appState.js
+++ b/src/app/appState.js
@@ -6,8 +6,8 @@ export default class AppState {
         this.uiTheme = persistData.uiTheme || 'dark';
         this.debugMode = false;
 
-        this.version = 1;
-        this.persistedVersion = persistData.version || 0.9;
+        this.version = 2;
+        this.persistedVersion = persistData.version || 0.1;
         this.wasOldVersion = persistData.version && this.version > this.persistedVersion;
     }
 
diff --git a/src/app/commands.js b/src/app/commands.js
index b4f3f8e..5e07e23 100644
--- a/src/app/commands.js
+++ b/src/app/commands.js
@@ -35,6 +35,9 @@ export default {
                 'light': function () {
                     appState.setUiTheme('light');
                 },
+                'midnight': function() {
+                    appState.setUiTheme('midnight');
+                },
                 'about': function(c) {
                     appState.addCommandResult(new AboutResult(c.input));
                 },
diff --git a/src/app/components/AppRoot.jsx b/src/app/components/AppRoot.jsx
index f7d3c55..fd1456a 100644
--- a/src/app/components/AppRoot.jsx
+++ b/src/app/components/AppRoot.jsx
@@ -28,7 +28,7 @@ export default class AppRoot extends React.Component {
     render() {
         return <div className={`app-root ${this.state.uiTheme}`}>
                     <div className="header">
-                        <h1>Bitwise<span style={{color: "#c5c5c5"}}>Cmd</span></h1>
+                        <h1>Bitwise<span className="header-cmd">Cmd</span></h1>
                         <ul className="top-links">
                             <li>
                                 <a href="https://github.com/BorisLevitskiy/BitwiseCmd"><i className="icon github">&nbsp;</i><span className="link-text">Project on GitHub</span></a>
diff --git a/src/app/components/misc/CommandLink.jsx b/src/app/components/misc/CommandLink.jsx
new file mode 100644
index 0000000..52b5a88
--- /dev/null
+++ b/src/app/components/misc/CommandLink.jsx
@@ -0,0 +1,8 @@
+import React from 'react';
+import cmd from '../../cmd';
+
+export default class CommandLink extends React.Component {
+    render() {
+        return <a href="javascript:void(0)" onClick={e => cmd.execute(this.props.command || this.props.text)}>{this.props.text}</a>
+    }
+}
\ No newline at end of file
diff --git a/src/app/components/results/HelpResultView.jsx b/src/app/components/results/HelpResultView.jsx
index e8436f9..62bb05c 100644
--- a/src/app/components/results/HelpResultView.jsx
+++ b/src/app/components/results/HelpResultView.jsx
@@ -1,4 +1,6 @@
-import React from 'react'
+import React from 'react';
+import cmd from '../../cmd';
+import CommandLink from '../misc/CommandLink';
 
 export default class HelpResultView extends React.Component {
     render() {
@@ -8,15 +10,16 @@ export default class HelpResultView extends React.Component {
                                 <div className="section">
                                     <strong>Supported Commands</strong>
                                 <ul>
-                                    <li><code>23 ^ 34</code> — type bitwise expression to see result in binary (only positive integers are supported now)</li>
-                                    <li><code>23 34</code> — type one or more numbers to see their binary representations</li>
-                                    <li><code>clear</code> — clear output pane</li>
-                                    <li><code>help</code> — display this help</li>
-                                    <li><code>whatsnew</code> — display changelog</li>
-                                    <li><code>em</code> — turn On/Off Emphasize Bytes</li>
-                                    <li><code>dark</code> — set Dark theme</li>
-                                    <li><code>light</code> — set Light theme</li>
-                                    <li><code>about</code> — about the app</li>
+                                    <li><code><CommandLink text="23 | 34" /></code> — type bitwise expression to see result in binary (only positive integers are supported now)</li>
+                                    <li><code><CommandLink text="23 34" /></code> — type one or more numbers to see their binary representations</li>
+                                    <li><code><CommandLink text="clear" /></code> — clear output pane</li>
+                                    <li><code><CommandLink text="help" /></code> — display this help</li>
+                                    <li><code><CommandLink text="whatsnew" /></code> — display changelog</li>
+                                    <li><code><CommandLink text="em" /></code> — turn On/Off Emphasize Bytes</li>
+                                    <li><code><CommandLink text="light" /></code> — set Dark theme</li>
+                                    <li><code><CommandLink text="dark" /></code> — set Light theme</li>
+                                    <li><code><CommandLink text="midnight" /></code> — set Midnight theme</li>
+                                    <li><code><CommandLink text="about" /></code> — about the app</li>
                                 </ul>
                                 </div>
                             </div>
diff --git a/src/app/components/results/WhatsnewResultView.jsx b/src/app/components/results/WhatsnewResultView.jsx
index 7557975..9c1e360 100644
--- a/src/app/components/results/WhatsnewResultView.jsx
+++ b/src/app/components/results/WhatsnewResultView.jsx
@@ -1,11 +1,15 @@
 import React from 'react'
+import CommandLink from '../misc/CommandLink'
 
 export default class WhatsnewResultView extends React.Component {
     render() {
         return <div className="changelog">
                     <h3>BitwiseCmd Changelog</h3>    
                     <div className="item">
-                        <p><strong>May 16th, 2017</strong> Complete rewrite using React. Old implementation is available at <a href="http://bitwisecmd.com/old">http://bitwisecmd.com/old</a>.</p>
+                        <p><span className="soft">May 20th, 2017</span> New <CommandLink text="Midnight" /> theme added. </p>
+                    </div>  
+                    <div className="item">
+                        <p><span className="soft">May 16th, 2017</span> Complete rewrite using React. Old implementation is available at <a href="http://bitwisecmd.com/old">http://bitwisecmd.com/old</a>.</p>
                         <p>Please let me know if you have problems with this release by <a href="https://github.com/BorysLevytskyi/BitwiseCmd/issues">creating issue</a> in Github Repo.</p>
                     </div>  
               </div>;
diff --git a/src/css/styles.css b/src/css/styles.css
index 694c6bb..66757c5 100644
--- a/src/css/styles.css
+++ b/src/css/styles.css
@@ -4,6 +4,8 @@ html { height: 100% }
 .app-root { font-family: Verdana; font-size: 0.8em; margin: 0; padding: 20px 100px 0 100px; height: 100%; overflow: auto; }
 code { font-size: 1.2em; font-weight: bold; }
 
+.header-cmd { color: #c5c5c5 }
+
 .top-links { position: absolute; right: 10px; top: 10px; list-style-type: none; margin: 0 }
 .top-links li { float: left; }
 .top-links a { display: inline-block; padding: 10px 15px}
@@ -43,6 +45,10 @@ code { font-size: 1.2em; font-weight: bold; }
 .indicator { padding: 2px 5px;  font-family: monospace; font-size: 1.3em; background: transparent; border: none; cursor: pointer }
 .error { color: maroon; }
 
+.soft { opacity: 0.7 }
+
+.changelog .item { margin-top: 2em; }
+
 #view { padding: 10px}
 
 .cur { color: lightgray; }
@@ -50,12 +56,15 @@ code { font-size: 1.2em; font-weight: bold; }
 .icon { width: 16px; height: 16px; display: inline-block; }
 .light .twitter { background: url('../img/twitter-light.png') }
 .dark .twitter { background: url('../img/twitter-dark.png') }
+.midnight .twitter { background: url('../img/twitter-dark.png') }
 
 .light .feedback { background: url('../img/feedback-light.png') }
 .dark .feedback { background: url('../img/feedback-dark.png') }
+.midnight .feedback { background: url('../img/feedback-dark.png') }
 
-.dark .github { background: url('../img/github-dark.png') }
 .light .github { background: url('../img/github-light.png') }
+.dark .github { background: url('../img/github-dark.png') }
+.midnight .github { background: url('../img/github-dark.png') }
 
 /* Light */
 .light { background: #fafafa; }
@@ -69,6 +78,7 @@ code { font-size: 1.2em; font-weight: bold; }
 .light .hashLink, .light .hashLink:visited { color: #ddd }
 .light .hashLink:hover { color: #888 }
 .light ul.top-links li:hover { background: #ddd }
+.light .error { color: #da586d }
 
 /* Dark */
 .dark { background: #121212; color: white;}
@@ -83,7 +93,25 @@ code { font-size: 1.2em; font-weight: bold; }
 .dark .hashLink, .dark .hashLink:visited { color: #333 }
 .dark .hashLink:hover { color: #999 }
 .dark ul.top-links li:hover { background: #333 }
-.dark .error { color: mediumvioletred}
+.dark .error { color: #da586d}
+
+/*
+    Midnight Theme
+*/
+.midnight .header-cmd { color: #85a0ad }
+.midnight { background: #2c3e50; color: white }
+.midnight .expression { color: white;}
+.midnight .expressionInput { background: #2c3e50; color: white; border-color: #85a0ad }
+.midnight a, .dark a:visited { color: white; }
+.midnight .indicator { color: #85a0ad; }
+.midnight .on { color: white; }
+.midnight .zero { color: #85a0ad;}
+.midnight .prefix { color: #85a0ad}
+.midnight  .other { color: #9FBAC7;}
+.midnight .hashLink, .dark .hashLink:visited { color: #333 }
+.midnight .hashLink:hover { color: #85a0ad }
+.midnight ul.top-links li:hover { background: #132537 }
+.midnight .error { color:#da586d}
 
 /* Top Links Shrink */
 @media (max-width: 800px) {