diff --git a/index.html b/index.html
index 9c22935d..0cf1372c 100644
--- a/index.html
+++ b/index.html
@@ -151,7 +151,7 @@ speak multiple languages and allow you to easily create localized websites.</li>
 <div class="slideshow-wrapper">
   <div class="slideshow">
     <div class="slideshow-inner">
-      <div class="carousel slide" data-ride="carousel" data-interval="8500" id="carousel-a1dd43705485419bb95501b597897b63">
+      <div class="carousel slide" data-ride="carousel" data-interval="8500" id="carousel-3ef97a18afd447e8824539e957c562ef">
         
         <div class="carousel-inner" role="listbox">
           
@@ -210,11 +210,11 @@ be completely customized.</p>
           </div>
           
         </div>
-        <a class="left carousel-control" href="#carousel-a1dd43705485419bb95501b597897b63" role="button" data-slide="prev">
+        <a class="left carousel-control" href="#carousel-3ef97a18afd447e8824539e957c562ef" role="button" data-slide="prev">
           <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
           <span class="sr-only">Previous</span>
         </a>
-        <a class="right carousel-control" href="#carousel-a1dd43705485419bb95501b597897b63" role="button" data-slide="next">
+        <a class="right carousel-control" href="#carousel-3ef97a18afd447e8824539e957c562ef" role="button" data-slide="next">
           <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
           <span class="sr-only">Next</span>
         </a>
diff --git a/showcase/index.html b/showcase/index.html
index d1b0947a..7b3a049f 100644
--- a/showcase/index.html
+++ b/showcase/index.html
@@ -327,6 +327,22 @@
             </a>
           </div>
         
+          <div class="project col-md-6">
+            <a href="vignette/">
+              <h2>Vignette</h2>
+              
+                
+                <div class="frame">
+                  <img src="vignette/vignette-features-1@480.jpg" width="100%" alt="">
+                </div>
+              
+            </a>
+          </div>
+        
+      </div>
+    
+      <div class="row">
+        
           <div class="project col-md-6">
             <a href="xinfengtv-website/">
               <h2>XinFengTv Website</h2>
@@ -339,10 +355,6 @@
             </a>
           </div>
         
-      </div>
-    
-      <div class="row">
-        
           <div class="project col-md-6">
             <a href="yargies/">
               <h2>Yargies Games</h2>
diff --git a/showcase/vignette/index.html b/showcase/vignette/index.html
new file mode 100644
index 00000000..3e1f0027
--- /dev/null
+++ b/showcase/vignette/index.html
@@ -0,0 +1,166 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <link rel="stylesheet" href="../../static/styles.css?h=dff0aaad">
+  <link rel="stylesheet" href="../../static/pygments.css">
+  <link rel="shortcut icon" href="../../static/favicon.png?h=fa09bedd">
+  <title>Vignette | Lektor Static Content Management System</title>
+</head>
+<body class="default">
+  <nav class="navbar navbar-inverse navbar-static-top">
+    <div class="container">
+      <div class="navbar-header">
+        <button type="button" class="navbar-toggle collapsed"
+          data-toggle="collapse" data-target="#navbar"
+          aria-expanded="false" aria-controls="navbar">
+          <span class="sr-only">Toggle navigation</span>
+          <span class="icon-bar"></span>
+          <span class="icon-bar"></span>
+          <span class="icon-bar"></span>
+        </button>
+        <a class="navbar-brand" href="../../">Lektor</a>
+      </div>
+      <div id="navbar" class="collapse navbar-collapse">
+        <ul class="nav navbar-nav">
+          
+            <li><a href="../../downloads/">Download</a></li>
+          
+            <li><a href="../../docs/">Documentation</a></li>
+          
+            <li class="active"><a href="../">Showcase</a></li>
+          
+            <li><a href="../../plugins/">Plugins</a></li>
+          
+            <li><a href="../../community/">Community</a></li>
+          
+            <li><a href="../../blog/">Blog</a></li>
+          
+        </ul>
+      </div>
+    </div>
+  </nav>
+
+  <div class="body-wrapper">
+    
+  <div class="container showcase-site">
+    <div class="row">
+      <div class="back-link">
+        <a href="../">Back to Showcase</a>
+      </div>
+      <h1>Vignette</h1>
+      <p class="site-link"><a href="https://vignette.agency/">vignette.agency</a>
+    </div>
+    <div class="row">
+      <div class="col-md-8 col-md-offset-2">
+        <p>A photographic portfolio site for Vignette, built with <a href="https://www.getlektor.com/">Lektor</a> and the <a href="https://bulma.io/">Bulma CSS Framework</a>. The contact form was implemented with <a href="https://formspree.io/">Formspree</a>. Deployed and hosted on Netlify. The code repository for this project is <a href="https://github.com/jurgenizer/-vignette-portfolio-">here</a></p>
+
+      </div>
+    </div>
+  </div>
+  <div class="slideshow-wrapper">
+    <div class="slideshow">
+      <div class="slideshow-inner">
+        <div class="carousel slide" data-ride="carousel" data-interval="8500" id="site-slides">
+          <ol class="carousel-indicators">
+          
+            <li data-target="#site-slides" data-slide-to="0" class="active"></li>
+          
+            <li data-target="#site-slides" data-slide-to="1"></li>
+          
+            <li data-target="#site-slides" data-slide-to="2"></li>
+          
+          </ol>
+          <div class="carousel-inner" role="listbox">
+            
+            <div class="item slide active">
+              <div class="container">
+                <img class="large" src="vignette-features-1.jpg">
+              </div>
+            </div>
+            
+            <div class="item slide">
+              <div class="container">
+                <img class="large" src="vignette-contact-3.png">
+              </div>
+            </div>
+            
+            <div class="item slide">
+              <div class="container">
+                <img class="large" src="vignette-feature-detail-2.jpg">
+              </div>
+            </div>
+            
+          </div>
+          <a class="left carousel-control" href="#site-slides" role="button" data-slide="prev">
+            <span class="glyphicon glyphicon-chevron-left" aria-hidden="true"></span>
+            <span class="sr-only">Previous</span>
+          </a>
+          <a class="right carousel-control" href="#site-slides" role="button" data-slide="next">
+            <span class="glyphicon glyphicon-chevron-right" aria-hidden="true"></span>
+            <span class="sr-only">Next</span>
+          </a>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  </div>
+
+  
+  <div class="bottomsummary">
+    <div class="container">
+    </div>
+  </div>
+  
+
+  
+  <footer>
+    <div class="container">
+      <div class="row">
+        <div class="col-sm-4 icon-bar">
+          <a href="https://github.com/lektor/lektor/" title="Lektor on GitHub"
+            ><i class="fa fa-github"></i></a>
+          <a href="https://github.com/lektor/lektor/issues/" title="Report Issues for Lektor"
+            ><i class="fa fa-bug"></i></a>
+          <a href="https://twitter.com/getlektor" title="Find Lektor on Twitter"
+            ><i class="fa fa-twitter"></i></a>
+          <a href="https://gitter.im/lektor/lektor" title="Chat on Gitter"
+            ><i class="fa fa-comment"></i></a>
+          <a href="https://github.com/lektor/lektor-website/tree/master/content/showcase/vignette/contents.lr" title="View source for this page"><i class="fa fa-code"></i></a>
+        </div>
+        <div class="col-sm-8">
+          <a href="../../license/">License & Copyright</a> •
+          <a href="../../contact/">Contact</a> •
+          Made with <i class="fa fa-fw fa-heart" title="Heart"><span hidden>Heart</span></i> in Carinthia
+        </div>
+      </div>
+    </div>
+  </footer>
+  
+
+  <script type=text/javascript src="../../static/app.js?h=396519c0" charset="utf-8"></script>
+  <script>
+    ((window.gitter = {}).chat = {}).options = {
+      room: 'lektor/lektor',
+      activationElement: null
+    };
+    document.write('<button class="js-gitter-toggle-chat-button">Toggle Chat</button>');
+    var dnt = navigator.doNotTrack || window.doNotTrack || navigator.msDoNotTrack;
+    if (dnt != "1" && dnt != "yes") {
+    window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
+      ga('create', 'UA-70822533-1', 'auto');
+      ga('set', 'anonymizeIp', true);
+      ga('send', 'pageview');
+    } else {
+      console.debug("Respecting Do-Not-Track, not running analytics.");
+    }
+  </script>
+  <script async src='https://www.google-analytics.com/analytics.js'></script>
+  <script async defer id="github-bjs" src="https://buttons.github.io/buttons.js"></script>
+  <script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
+  <script src="https://sidecar.gitter.im/dist/sidecar.v1.js" async defer></script>
+</body>
+</html>
diff --git a/showcase/vignette/vignette-contact-3.png b/showcase/vignette/vignette-contact-3.png
new file mode 100644
index 00000000..c012107e
Binary files /dev/null and b/showcase/vignette/vignette-contact-3.png differ
diff --git a/showcase/vignette/vignette-feature-detail-2.jpg b/showcase/vignette/vignette-feature-detail-2.jpg
new file mode 100644
index 00000000..fdcf315e
Binary files /dev/null and b/showcase/vignette/vignette-feature-detail-2.jpg differ
diff --git a/showcase/vignette/vignette-features-1.jpg b/showcase/vignette/vignette-features-1.jpg
new file mode 100644
index 00000000..45b94c41
Binary files /dev/null and b/showcase/vignette/vignette-features-1.jpg differ
diff --git a/showcase/vignette/vignette-features-1@480.jpg b/showcase/vignette/vignette-features-1@480.jpg
new file mode 100644
index 00000000..5cff20e9
Binary files /dev/null and b/showcase/vignette/vignette-features-1@480.jpg differ
diff --git a/sitemap.xml b/sitemap.xml
index 6f05d98d..ffadc122 100644
--- a/sitemap.xml
+++ b/sitemap.xml
@@ -22,6 +22,7 @@
   <url><loc>https://www.getlektor.com/showcase/taiga-support/</loc></url>
   <url><loc>https://www.getlektor.com/showcase/terminal-labs/</loc></url>
   <url><loc>https://www.getlektor.com/showcase/tracetronic/</loc></url>
+  <url><loc>https://www.getlektor.com/showcase/vignette/</loc></url>
   <url><loc>https://www.getlektor.com/showcase/xinfengtv-website/</loc></url>
   <url><loc>https://www.getlektor.com/showcase/yargies/</loc></url>
   <url><loc>https://www.getlektor.com/docs/</loc></url>
