diff --git a/tools/jsdoc/README.md b/tools/jsdoc/README.md
index f3dda84291..8526bccc4e 100644
--- a/tools/jsdoc/README.md
+++ b/tools/jsdoc/README.md
@@ -11,7 +11,7 @@ If you would like the extra functionality for gravPrep:
 To generate html documentation for the High Fidelity JavaScript API:
 
 * `cd tools/jsdoc`
-* `jsdoc root.js -c config.json`
+* `jsdoc root.js -r api-mainpage.md -c config.json`
 
 The out folder should contain index.html.
 
diff --git a/tools/jsdoc/api-mainpage.md b/tools/jsdoc/api-mainpage.md
new file mode 100644
index 0000000000..e1ec140af3
--- /dev/null
+++ b/tools/jsdoc/api-mainpage.md
@@ -0,0 +1,9 @@
+The High Fidelity JavaScript API lets content creators and developers create new experiences and transform virtual worlds within the High Fidelity metaverse. With it, you can build great content, customize avatars, play audio and so much more. 
+
+You are most likely to interact with these APIs:
+
+* The **[Entities](Entities.html)** namespace lets you add, remove, and edit entities around you to build an interactive environment. In addition, you can use this namespace to find entities in range, direction, collision, or raytrace.
+* The **[AvatarList](AvatarList.html)**, **[MyAvatar](MyAvatar.html)**, and **[Avatar](Avatar.html)** namespaces affect your personal avatars, and lets you get information on other people's avatars. 
+* The **[Script](Script.html)** namespace lets you to connect callbacks from your client to script, such as functionality that is dependent on time (`Script.update`, `Script.setTimeout`, `Script.setInterval`, etc), connect paths relatively to assets (`Script.resolvePath`), refer to other scripts (`Script.require`, `Script.include`), or connect functions to events which occur when the script is turned off (`Script.scriptEnding`).
+
+To learn more about using High Fidelity and exploring the metaverse, visit the [High Fidelity Documentation](https://docs.highfidelity.com).    
\ No newline at end of file
diff --git a/tools/jsdoc/hifi-jsdoc-template/publish.js b/tools/jsdoc/hifi-jsdoc-template/publish.js
index 9cd428bbbb..7d0ded5a0b 100644
--- a/tools/jsdoc/hifi-jsdoc-template/publish.js
+++ b/tools/jsdoc/hifi-jsdoc-template/publish.js
@@ -420,7 +420,7 @@ function linktoExternal(longName, name) {
  */
 
 function buildNav(members) {
-    var nav = '<h3><a href="index.html">Home</a></h3>';
+    var nav = '<h3><a href="index.html">API Reference Home</a></h3>';
     var seen = {};
     var seenTutorials = {};
     var docdash = env && env.conf && env.conf.docdash || {};
diff --git a/tools/jsdoc/hifi-jsdoc-template/static/fonts/Cairo-Bold.ttf b/tools/jsdoc/hifi-jsdoc-template/static/fonts/Cairo-Bold.ttf
deleted file mode 100644
index ad884391d7..0000000000
Binary files a/tools/jsdoc/hifi-jsdoc-template/static/fonts/Cairo-Bold.ttf and /dev/null differ
diff --git a/tools/jsdoc/hifi-jsdoc-template/static/fonts/Graphik-Regular.otf b/tools/jsdoc/hifi-jsdoc-template/static/fonts/Graphik-Regular.otf
new file mode 100644
index 0000000000..8100438827
Binary files /dev/null and b/tools/jsdoc/hifi-jsdoc-template/static/fonts/Graphik-Regular.otf differ
diff --git a/tools/jsdoc/hifi-jsdoc-template/static/fonts/Graphik-Semibold.otf b/tools/jsdoc/hifi-jsdoc-template/static/fonts/Graphik-Semibold.otf
new file mode 100644
index 0000000000..45cf6bc865
Binary files /dev/null and b/tools/jsdoc/hifi-jsdoc-template/static/fonts/Graphik-Semibold.otf differ
diff --git a/tools/jsdoc/hifi-jsdoc-template/static/images/fav-icon.ico b/tools/jsdoc/hifi-jsdoc-template/static/images/fav-icon.ico
new file mode 100644
index 0000000000..2bacaf1083
Binary files /dev/null and b/tools/jsdoc/hifi-jsdoc-template/static/images/fav-icon.ico differ
diff --git a/tools/jsdoc/hifi-jsdoc-template/static/images/white-logo.png b/tools/jsdoc/hifi-jsdoc-template/static/images/white-logo.png
index 18cd2d88dd..b23aa64e94 100644
Binary files a/tools/jsdoc/hifi-jsdoc-template/static/images/white-logo.png and b/tools/jsdoc/hifi-jsdoc-template/static/images/white-logo.png differ
diff --git a/tools/jsdoc/hifi-jsdoc-template/static/styles/jsdoc.css b/tools/jsdoc/hifi-jsdoc-template/static/styles/jsdoc.css
index 2ba9c84954..2232491d04 100644
--- a/tools/jsdoc/hifi-jsdoc-template/static/styles/jsdoc.css
+++ b/tools/jsdoc/hifi-jsdoc-template/static/styles/jsdoc.css
@@ -4,8 +4,13 @@
 ********************************************************************/
 
 @font-face{
-	font-family: 'Cairo';
-	src: url('../fonts/Cairo-Bold.ttf') format('truetype');
+	font-family: 'Graphik Semibold';
+	src: url('../fonts/Graphik-SemiBold.otf') format('opentype');
+}
+
+@font-face{
+	font-family: 'Graphik Regular';
+	src: url('../fonts/Graphik-Regular.otf') format('opentype');
 }
 
 @font-face{
@@ -29,12 +34,15 @@ html
 
 body
 {
-    font-family: 'Proxima Nova', sans-serif;
-    font-size: 1rem;
-    line-height: 1.5;
-    letter-spacing: 0.5px;
-    margin: 1.5rem;
-    color: #555;
+	font-family: 'Graphik Regular', 'Proxima Nova', arial, sans-serif;
+	font-weight: 400; 
+    color: #000000;
+    letter-spacing: 0.5px;  
+}
+
+#main p {
+    line-height: 24px;
+    margin-bottom: 24px;
 }
 
 section
@@ -50,14 +58,13 @@ section
 ********************************************************************/
 
 h1, h2, h3, h4 {
-	font-family: "Cairo", Helvetica, sans-serif;
+	font-family: "Graphik Semibold", Helvetica, sans-serif;
 }
 
 h1
 {
     font-size: 3.25rem;
     text-align: center;
-    letter-spacing: 1.5px;
     margin: 50px 25px 25px;
 }
 
@@ -69,15 +76,13 @@ h2
 
 h3
 {
-    font-size: 1.5rem;
+    font-size: 28px;
 }
 
 h4
 {
-    font-size: 18px;
-    letter-spacing: -0.33px;
-    margin-bottom: 12px;
-    color: #4d4e53;
+    font-family: 'Graphik Regular';
+	font-size: 1.03rem;
 }
 
 h6
@@ -119,7 +124,7 @@ table
     background-color: #fff;
     border-collapse: collapse;
     border-spacing: 0;
-    border: 1px solid #ccc;
+	border: solid #d8e1d9 1px;
     text-align: left;
     overflow: auto;
     font-size: 0.9rem;
@@ -128,18 +133,19 @@ table
 }
 
 table > thead {
-    background-color: #ddd;
-    border-bottom: 1px solid #ccc;
+    border-color: #d8e1d9;
+    background: #d8e1d9;
     font-weight: 400;
 }
 
 table th, table td {
     padding: 0.5rem;
-    border-left: 1px solid #ccc;
+    border-left: 1px solid #d8e1d9;
+    font-size: .95em;
 }
 
 table tr {
-    border-bottom: 1px solid #ccc;
+    border-bottom: 1px solid #d8e1d9;
 }
 
 table tr:nth-child(even) {
@@ -150,18 +156,14 @@ table tr:nth-child(even) {
 ****************************** Link styles *************************
 ********************************************************************/
 
-a, a:visited, a:active {
-  color: #1694CA;
-  text-decoration: none;
+a, a:hover, a:active, a:visited {
+    text-decoration: none;
 }
 
-article a:hover {
-  color: #0e6185;
-  text-decoration: none;
-  font-weight: bold;
+#main a, #main a:visited, #main a:active, #main a:hover {
+  color: #009ee0;
 }
 
-
 /*******************************************************************
 ***************************** List styles **************************
 ********************************************************************/
@@ -171,20 +173,29 @@ article ul {
 }
 
 article li {
+    font-size: .95rem;
     padding-bottom: 5px;
 }
 
+.readme ul {
+    font-size: 0.95rem;
+    line-height: 24px;
+    margin-bottom: 24px;
+
+}
+
 /*******************************************************************
 ********************** Navigation sidebar styles *******************
 ********************************************************************/
 
 nav {
     position: fixed;
-    top: 165px;
+    top: 260px;
     bottom: 0;
     left: 0;
     right: 0;
-    width: 305px;
+    width: 300px;
+    background-color: #000000;
     border-right: 1px solid #ccc;
     overflow-y: scroll;
     padding-left: 20px;
@@ -192,6 +203,11 @@ nav {
     box-sizing: border-box;
 }
 
+nav::-webkit-scrollbar {
+    width: 0;
+    height: 0;
+}
+
 nav #nav-search {
     width: 210px;
     height: 30px;
@@ -207,21 +223,28 @@ nav #nav-search {
     position: fixed;
     top: 0;
     left: 0;
-    height: 165px;
-    width: 305px;
-    background-color: #00B4EF;
-    vertical-align: middle;
+    height: 260px;
+    width: 300px;
+    background-color: #000000;
+    color: #FFFFFF;
     text-align: center;
     margin-top: 0px;    
 }
 
 .nav-header p {
-    padding-top: 15px;
+    padding-top: 8px;    
+}
+
+.nav-header a {
+    color: #FFFFFF;
+    font-size: .9rem;
+    line-height: 1.5;
 }
 
 nav h3 {
-    font-family: "Proxima Nova", sans-serif;
+    font-family: "Graphik Regular", sans-serif;
     font-size: 0.9rem;
+    color: #FFFFFF;
     text-transform: uppercase;
     letter-spacing: 0.5px;
 }
@@ -233,8 +256,16 @@ nav ul {
     list-style: none;
 }
 
+nav h3 a {
+    color: #FFFFFF;
+}
+
 nav ul a, nav ul a:visited, nav ul a:active {
-    color: #a1a1a1;
+    color: #FFFFFF;
+}
+
+nav ul a:hover {
+    font-weight: bold;
 }
 
 nav ul ul {
@@ -250,7 +281,7 @@ nav ul ul li:first-child
 
 nav li 
 {
-    margin-top: 3px;
+    margin-top: 14px;
 }
  
 
@@ -333,14 +364,14 @@ nav > h2 > a {
 
 .search-input
 {
-    font-family: 'Proxima Nova', sans-serif;
-    font-size:  0.9rem;    
+    font-family: 'Graphik Regular', sans-serif;
+    font-size: 80%;    
     border: 1px solid #ddd;
     box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06);
-    border-radius: 0.1875rem;    
+    border-radius: 0;    
     color: #3A3F3E;
-    width: 75%;
-    padding: 0.425rem;
+    width: 70%;
+    padding: 10px;
 }
 
 /********************************************************************
@@ -349,23 +380,20 @@ nav > h2 > a {
 
 tt, code, kbd, samp {
     font-family: Consolas, Monaco, 'Andale Mono', monospace;
-    font-size: 0.8rem;
+    font-size: 0.9rem;
 }
 
 .name, .signature {
   font-family: Consolas, Monaco, 'Andale Mono', monospace;
-  font-size: 0.8rem;
+  font-size: 0.9rem;
 }
 
 
 
-
-
-
-
-
 img {
+  display: block;
   max-width: 100%;
+  margin: auto;
 }
 
 p, ul, ol, blockquote {
@@ -427,7 +455,7 @@ header {
    color: #999 !important;
 }
 
-.availableIn 
+#main p.availableIn 
 {
     font-size: 0.8rem;
 }
@@ -517,7 +545,7 @@ header {
 
 .prettyprint code
 {
-    font-size: 0.65rem;
+    font-size: 0.7rem;
     line-height: 18px;
     display: block;
     padding: 4px 12px;
@@ -580,13 +608,8 @@ header {
    padding-top: 0;
 }
 
-.params td.description > p:last-child, .props td.description > p:last-child {
-   margin-bottom: 0;
-   padding-bottom: 0;
-}
-
 span.param-type, .params td .param-type, .param-type dd {
-   color: #606;
+  color: #606;
   font-family: Consolas, Monaco, 'Andale Mono', monospace
 }
 
diff --git a/tools/jsdoc/hifi-jsdoc-template/tmpl/layout.tmpl b/tools/jsdoc/hifi-jsdoc-template/tmpl/layout.tmpl
index 6f267587c0..41a324fdaf 100644
--- a/tools/jsdoc/hifi-jsdoc-template/tmpl/layout.tmpl
+++ b/tools/jsdoc/hifi-jsdoc-template/tmpl/layout.tmpl
@@ -16,10 +16,11 @@
 <body>
 
 <div class="nav-header">
-    <p><img src="images/white-logo.png" width="200px" /></p>
+    <p><a href="https://www.highfidelity.com"><img src="images/white-logo.png" width="214px" /></a></p>
     <?js if (env.conf.docdash.search) { ?>
-    <input type="text" class="search-input" id="nav-search" placeholder="Search ..." />
+    <input type="text" class="search-input" id="nav-search" placeholder="Search API Docs ..." />
     <?js } ?>
+    <p><a href="https://docs.highfidelity.com">Looking for <strong>High Fidelity</strong><br /> Documentation?</a></p>
 </div>
 
 <nav>
@@ -69,5 +70,54 @@
     <?js } ?>
 <?js } ?>
 
+<!-- Start Google Analytics Tag -->
+<script>
+  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
+  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
+  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
+  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');
+
+  ga('create', '{{ theme_config.google_analytics_code }}', 'auto');
+  ga('send', 'pageview');
+</script>
+<!-- End Google Analytics Tag -->
+
+<!-- Start of HubSpot Embed Code -->
+<script type="text/javascript" id="hs-script-loader" async defer src="//js.hs-scripts.com/5066246.js"></script>
+<!-- End of HubSpot Embed Code -->
+
+<!-- Start Quantcast Tag -->
+<script type="text/javascript">
+var _qevents = _qevents || [];
+ (function() {
+   var elem = document.createElement('script');
+   elem.src = (document.location.protocol == "https:" ? "https://secure" : "http://edge") + ".quantserve.com/quant.js";
+   elem.async = true;
+   elem.type = "text/javascript";
+   var scpt = document.getElementsByTagName('script')[0];
+   scpt.parentNode.insertBefore(elem, scpt);
+  })();
+_qevents.push({qacct: "p-tK6PFLJY3q1s-"});
+</script>
+<noscript>
+ <img src="//pixel.quantserve.com/pixel/p-tK6PFLJY3q1s-.gif?labels=_fp.event.Default" style="display: none;" border="0" height="1" width="1" alt="Quantcast"/>
+</noscript>
+<!-- End Quantcast Tag -->
+
+
+<!-- Start Hotjar Tracking Code for https://highfidelity.com/ -->
+<script>
+    (function(h,o,t,j,a,r){
+        h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+        h._hjSettings={hjid:908553,hjsv:6};
+        a=o.getElementsByTagName('head')[0];
+        r=o.createElement('script');r.async=1;
+        r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
+        a.appendChild(r);
+    })(window,document,'https://static.hotjar.com/c/hotjar-','.js?sv=');
+</script>
+<!-- End Hotjar Tracking Code for https://highfidelity.com/ -->
+
+
 </body>
 </html>
diff --git a/tools/jsdoc/hifi-jsdoc-template/tmpl/method.tmpl b/tools/jsdoc/hifi-jsdoc-template/tmpl/method.tmpl
index 153459f475..8c78643b3e 100644
--- a/tools/jsdoc/hifi-jsdoc-template/tmpl/method.tmpl
+++ b/tools/jsdoc/hifi-jsdoc-template/tmpl/method.tmpl
@@ -20,7 +20,7 @@ var self = this;
         <tbody>
             <tr>
                 <td>
-                    <?js if (data.kind !== 'module' && data.description && !data.hideconstructor) { ?>
+                    <?js if (data.kind !== 'module' && !data.hideconstructor) { ?>
                         <p>
                             <?js= data.description ?>
                             <?js= this.partial('details.tmpl', data) ?>
diff --git a/tools/jsdoc/hifi-jsdoc-template/tmpl/params.tmpl b/tools/jsdoc/hifi-jsdoc-template/tmpl/params.tmpl
index 17f58b1677..e994e42bfa 100644
--- a/tools/jsdoc/hifi-jsdoc-template/tmpl/params.tmpl
+++ b/tools/jsdoc/hifi-jsdoc-template/tmpl/params.tmpl
@@ -71,7 +71,7 @@
         <?js } ?>
 
         <?js if (params.hasDefault) {?>
-        <th>Default</th>
+        <th>Default Value</th>
         <?js } ?>
 
         <th class="last">Description</th>
@@ -96,10 +96,26 @@
             <?js } ?>
             </td>
 
+            <?js if (params.hasAttributes) {?>
+                <td class="attributes">
+                <?js if (param.optional) { ?>
+                    &lt;optional><br>
+                <?js } ?>
+
+                <?js if (param.nullable) { ?>
+                    &lt;nullable><br>
+                <?js } ?>
+
+                <?js if (param.variable) { ?>
+                    &lt;repeatable><br>
+                <?js } ?>
+                </td>
+            <?js } ?>
+
             <?js if (params.hasDefault) {?>
                 <td class="default">
                 <?js if (typeof param.defaultvalue !== 'undefined') { ?>
-                    Default Value: <?js= self.htmlsafe(param.defaultvalue) ?>
+                    <?js= self.htmlsafe(param.defaultvalue) ?>
                 <?js } ?>
                 </td>
             <?js } ?>