diff --git a/_layout.html b/_layout.html
index e0ccd8d0b..3c5d1128c 100644
--- a/_layout.html
+++ b/_layout.html
@@ -8,6 +8,7 @@
   <link rel="shortcut icon" href="/img/v-logo.png">
   <link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,300,100,200,500,700|Roboto+Mono:400,300,100,200,500" media="none" onload="if(media!='all')media='all'"><noscript><link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,300,100,200,500,700|Roboto+Mono:400,300,100,200,500"></noscript>
   @css "app.css?43"
+  <link rel="stylesheet" href="https://unpkg.com/prismjs@1.29.0/themes/prism-okaidia.min.css">
   <!--
   <script src="tokenizer.js"></script>
   -->
@@ -58,6 +59,8 @@
 @end
 
 @define "footer"
+<script src="https://unpkg.com/prismjs@1.29.0/prism.js"></script>
+<script src="https://unpkg.com/prismjs@1.29.0/components/prism-v.min.js"></script>
 </body>
 </html>
 @end 
diff --git a/app.css b/app.css
index 76acd23b1..87575613a 100644
--- a/app.css
+++ b/app.css
@@ -249,6 +249,17 @@ textarea:focus {
 	color: #c5ac41
 }
 
+.codeblock pre.language-v {
+	padding: 0;
+	background: #334;
+	padding-bottom: 10px;
+}
+
+.codeblock pre code.language-v {
+	display: block;
+	line-height: 1.2 !important;
+}
+
 .documentation {
 	display: flex;
 	justify-content: center;
diff --git a/index.html b/index.html
index 46cbf1e29..c69d9c4be 100644
--- a/index.html
+++ b/index.html
@@ -221,15 +221,14 @@ <h1 style='font-size:1.85em'>The V Programming Language 0.4 <span style='backgro
   <div class='titlebar separator'>
     <div class='flex'></div>
   </div>
-  <pre class="hello_devs" id=ex1>fn main() {
+  <pre class="hello_devs" id=ex1><code class="language-v">fn main() {
     areas := [&#39;game&#39;, &#39;web&#39;, &#39;tools&#39;, &#39;science&#39;, &#39;systems&#39;,
               &#39;embedded&#39;, &#39;drivers&#39;, &#39;GUI&#39;, &#39;mobile&#39;]
     for area in areas {
         println(&#39;Hello, ${area} developers!&#39;)
     }
-}</pre>
-<pre class="hello_devs" id=ex2 style='display:none'>
-// Print file lines that start with "DEBUG:"
+}</code></pre>
+<pre class="hello_devs" id=ex2 style='display:none'><code class="language-v">// Print file lines that start with "DEBUG:"
 import os
 
 // `read_file` returns an optional (`?string`), it must be checked
@@ -245,20 +244,16 @@ <h1 style='font-size:1.85em'>The V Programming Language 0.4 <span style='backgro
     if line.starts_with('DEBUG:') {
         println(line)
     }
-}
-</pre>
-  <pre class="hello_devs" id=ex3 style='display:none'>
-import time
+}</code></pre>
+  <pre class="hello_devs" id=ex3 style='display:none'><code class="language-v">import time
 import net.http
 resp := http.get('https://vlang.io/utc_now') or {
     println('failed to fetch data from the server')
     return
 }
 t := time.unix(resp.body.int())
-println(t.format()) // 2019-08-16 17:48
-</pre>
-  <pre class="hello_devs" id=ex4 style='display:none'>
-import json
+println(t.format()) // 2019-08-16 17:48</code></pre>
+  <pre class="hello_devs" id=ex4 style='display:none'><code class="language-v">import json
 
 struct User {
     name string
@@ -283,8 +278,8 @@ <h1 style='font-size:1.85em'>The V Programming Language 0.4 <span style='backgro
             println('Cannot register ${user.name}, they are too young')
             continue
         }
-		// `user` is declared as `mut` in the for loop,
-		// modifying it will modify the array
+        // `user` is declared as `mut` in the for loop,
+        // modifying it will modify the array
         user.register()
     }
     // Let's encode users again just for fun
@@ -298,16 +293,12 @@ <h1 style='font-size:1.85em'>The V Programming Language 0.4 <span style='backgro
 
 fn (mut u User) register() {
     u.is_registered = true
-}
-
-  </pre>
+}</code></pre>
 
-<pre class="hello_devs" id=ex5 style='display:none'>
-import arrays
+<pre class="hello_devs" id=ex5 style='display:none'><code class="language-v">import arrays
 keys := ['accept', 'Accept', 'ACCEPT', 'Content-Type', 'content-type']
 unique_lowercase_keys := arrays.uniq(keys.map(it.to_lower()))
-println(unique_lowercase_keys) // ['accept', 'content-type']
-</pre>
+println(unique_lowercase_keys) // ['accept', 'content-type']</code></pre>
 
 </div>
 
@@ -1359,7 +1350,7 @@ <h2>Powerful built-in web framework Veb</h2>
         <div class='flex'></div>
         </div>
 
-        <pre><div id="codeblock_hl_93987704">[&#39;/post/:id&#39;]
+        <pre style="font-size: 80%;"><code class="language-v"><div id="codeblock_hl_93987704">[&#39;/post/:id&#39;]
 fn (b &Blog) show_post(id int) veb.Result {
   post := b.posts_repo.retrieve(id) or {
     return veb.not_found()
@@ -1396,7 +1387,7 @@ <h2>Powerful built-in web framework Veb</h2>
       <p><a href="https://github.com/vlang/gitly">Gitly</a>, a light and fast alternative to GitHub/GitLab is built in V and Veb.</p>
     </div>
 
-    <div class="block">
+    <div class="block" style="overflow: auto;">
 		<a target=_blank href='https://github.com/vlang/gitly'><img style='width:500px' src='https://user-images.githubusercontent.com/687996/85933714-b195fe80-b8da-11ea-9ddd-09cadc2103e4.png'></a>
 	</div>
 
@@ -1413,7 +1404,7 @@ <h2>Built-in ORM</h2>
     <div class='flex'></div>
   </div>
 
-  <pre><div id="codeblock_hl_69524066"><span class="keyword">import</span> db.sqlite
+  <pre style="font-size: 80%;"><code class="language-v"><div id="codeblock_hl_69524066"><span class="keyword">import</span> db.sqlite
 
 <span class="keyword">struct</span> Customer {
   id <span class="keyword">int</span>
@@ -1453,9 +1444,7 @@ <h2>Built-in ORM</h2>
   <span class="keyword">sql</span> db {
     <span class="keyword">insert</span> new_customer <span class="keyword">into</span> Customer
   }!
-}</div></pre>
-
-
+}</div></code></pre>
 </div>
 
 </div>