diff --git a/_docs/example.tmpl.html b/_docs/example.tmpl.html
index e6b02205b..5b2026edd 100644
--- a/_docs/example.tmpl.html
+++ b/_docs/example.tmpl.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 {{with .Example}}
-  <h1>Ebiten example - {{.Name}}</h1>
+  <h2>Ebiten example - {{.Name}}</h2>
   <iframe src="{{.Name}}.content.html" width="{{.Width}}" height="{{.Height}}"></iframe>
   <pre><code>{{.Source}}</code></pre>
 {{end}}
diff --git a/_docs/public/examples/alphablending.html b/_docs/public/examples/alphablending.html
index 273d899ac..93c0ee847 100644
--- a/_docs/public/examples/alphablending.html
+++ b/_docs/public/examples/alphablending.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - alphablending</h1>
+  <h2>Ebiten example - alphablending</h2>
   <iframe src="alphablending.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/audio.html b/_docs/public/examples/audio.html
index b6014916a..d0e13010f 100644
--- a/_docs/public/examples/audio.html
+++ b/_docs/public/examples/audio.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - audio</h1>
+  <h2>Ebiten example - audio</h2>
   <iframe src="audio.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/blocks.html b/_docs/public/examples/blocks.html
index db82d657d..c7264b2e3 100644
--- a/_docs/public/examples/blocks.html
+++ b/_docs/public/examples/blocks.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - blocks</h1>
+  <h2>Ebiten example - blocks</h2>
   <iframe src="blocks.content.html" width="512" height="480"></iframe>
   <pre><code>// Please read examples/blocks/main.go and examples/blocks/blocks/*.go
 // NOTE: If Gamepad API is available in your browswer, you can use gamepads. Try it out!</code></pre>
diff --git a/_docs/public/examples/font.html b/_docs/public/examples/font.html
index 4d5629eaf..11833d3e1 100644
--- a/_docs/public/examples/font.html
+++ b/_docs/public/examples/font.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - font</h1>
+  <h2>Ebiten example - font</h2>
   <iframe src="font.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/gamepad.html b/_docs/public/examples/gamepad.html
index a46a1e97d..b4b568594 100644
--- a/_docs/public/examples/gamepad.html
+++ b/_docs/public/examples/gamepad.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - gamepad</h1>
+  <h2>Ebiten example - gamepad</h2>
   <iframe src="gamepad.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/hsv.html b/_docs/public/examples/hsv.html
index c2c14d360..4ebae89df 100644
--- a/_docs/public/examples/hsv.html
+++ b/_docs/public/examples/hsv.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - hsv</h1>
+  <h2>Ebiten example - hsv</h2>
   <iframe src="hsv.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/hue.html b/_docs/public/examples/hue.html
index 30d7924f5..43c759dab 100644
--- a/_docs/public/examples/hue.html
+++ b/_docs/public/examples/hue.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - hue</h1>
+  <h2>Ebiten example - hue</h2>
   <iframe src="hue.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/keyboard.html b/_docs/public/examples/keyboard.html
index e2f50b80a..8bc5334dd 100644
--- a/_docs/public/examples/keyboard.html
+++ b/_docs/public/examples/keyboard.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - keyboard</h1>
+  <h2>Ebiten example - keyboard</h2>
   <iframe src="keyboard.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/masking.html b/_docs/public/examples/masking.html
index def754b98..70978b9b0 100644
--- a/_docs/public/examples/masking.html
+++ b/_docs/public/examples/masking.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - masking</h1>
+  <h2>Ebiten example - masking</h2>
   <iframe src="masking.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/mosaic.html b/_docs/public/examples/mosaic.html
index d3557d28b..69c5fec7a 100644
--- a/_docs/public/examples/mosaic.html
+++ b/_docs/public/examples/mosaic.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - mosaic</h1>
+  <h2>Ebiten example - mosaic</h2>
   <iframe src="mosaic.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/noise.html b/_docs/public/examples/noise.html
index 5201e1cfa..8f2717720 100644
--- a/_docs/public/examples/noise.html
+++ b/_docs/public/examples/noise.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - noise</h1>
+  <h2>Ebiten example - noise</h2>
   <iframe src="noise.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/paint.html b/_docs/public/examples/paint.html
index 69fd6cbbc..ac87f9826 100644
--- a/_docs/public/examples/paint.html
+++ b/_docs/public/examples/paint.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - paint</h1>
+  <h2>Ebiten example - paint</h2>
   <iframe src="paint.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/perspective.html b/_docs/public/examples/perspective.html
index 648ba4f30..6a130c977 100644
--- a/_docs/public/examples/perspective.html
+++ b/_docs/public/examples/perspective.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - perspective</h1>
+  <h2>Ebiten example - perspective</h2>
   <iframe src="perspective.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/piano.html b/_docs/public/examples/piano.html
index 4436c6d92..fa3615dc1 100644
--- a/_docs/public/examples/piano.html
+++ b/_docs/public/examples/piano.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - piano</h1>
+  <h2>Ebiten example - piano</h2>
   <iframe src="piano.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/rotate.html b/_docs/public/examples/rotate.html
index e71176577..cd4d50266 100644
--- a/_docs/public/examples/rotate.html
+++ b/_docs/public/examples/rotate.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - rotate</h1>
+  <h2>Ebiten example - rotate</h2>
   <iframe src="rotate.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/examples/sprites.html b/_docs/public/examples/sprites.html
index 8cab0b6bb..fffd89776 100644
--- a/_docs/public/examples/sprites.html
+++ b/_docs/public/examples/sprites.html
@@ -20,7 +20,7 @@
 
 <main><div class="container">
 
-  <h1>Ebiten example - sprites</h1>
+  <h2>Ebiten example - sprites</h2>
   <iframe src="sprites.content.html" width="640" height="480"></iframe>
   <pre><code>// &#43;build example
 
diff --git a/_docs/public/stylesheets/ebiten.css b/_docs/public/stylesheets/ebiten.css
index 97f300aad..998865837 100644
--- a/_docs/public/stylesheets/ebiten.css
+++ b/_docs/public/stylesheets/ebiten.css
@@ -1,3 +1,9 @@
+@import 'https://fonts.googleapis.com/css?family=Roboto:400,500,700,900';
+
+body {
+  font-family: 'Roboto', sans-serif;
+}
+
 img.example {
   background-color: #000;
 }
@@ -6,9 +12,14 @@ header {
   background-color: #dddddd;
 }
 
+header a {
+  color: #666 !important;
+}
+
 footer {
   background-color: #666666;
   color: #fff;
+  padding-top: 1em;
 }
 
 footer a {