diff --git a/packages/examples/quick-start/index.html b/packages/examples/quick-start/index.html
new file mode 100644
index 000000000..fa28df2db
--- /dev/null
+++ b/packages/examples/quick-start/index.html
@@ -0,0 +1,43 @@
+
+
+
+ Welcome to Vue
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
${{result.price}}
+
+
+
+
+
+
+
+
+
+
diff --git a/packages/examples/quick-start/package.json b/packages/examples/quick-start/package.json
new file mode 100644
index 000000000..2f2ccfb61
--- /dev/null
+++ b/packages/examples/quick-start/package.json
@@ -0,0 +1,10 @@
+{
+ "name": "example-simple",
+ "description": "Simple example of using Algolia instantsearch with Vue.js in the browser.",
+ "version": "0.0.0",
+ "author": "Raymond Rutjes ",
+ "private": true,
+ "dependencies": {
+ "vue-instantsearch": "*"
+ }
+}
diff --git a/packages/examples/quick-start/styles.css b/packages/examples/quick-start/styles.css
new file mode 100644
index 000000000..72f4cf8b6
--- /dev/null
+++ b/packages/examples/quick-start/styles.css
@@ -0,0 +1,107 @@
+#app {
+ font-family: 'Avenir', Helvetica, Arial, sans-serif;
+ -webkit-font-smoothing: antialiased;
+ -moz-osx-font-smoothing: grayscale;
+ color: #2c3e50;
+ width: 1400px;
+ margin: auto;
+}
+
+.ais-input {
+ width: 100%;
+ outline: none;
+ font-size: 15px;
+ padding: 7px;
+ box-sizing: border-box;
+ border: 2px solid lightgrey;
+ border-radius: 2px;
+ margin: 20px 0;
+ margin-right: 5%;
+}
+
+.ais-powered-by {
+ float: right;
+ margin-right: 10px;
+
+}
+
+.ais-powered-by svg {
+ vertical-align: bottom;
+}
+
+.search-result {
+ padding: 10px 20px 20px;
+ width: 25%;
+ border: solid 1px #EEE;
+ box-shadow: 0 0 3px #f6f6f6;
+
+ position: relative;
+ border-radius: 3px;
+ min-width: 220px;
+ background: #FFF;
+
+ display: inline;
+ float: left;
+ transition: all .5s;
+}
+
+.result__info {
+ position: absolute;
+ width: 100%;
+ padding: 0px 20px 20px;
+ bottom: 0;
+ left: 0;
+}
+
+.result__image {
+ margin-bottom: 100px;
+}
+
+.result__name {
+ font-size: 14px;
+ font-weight: bold;
+}
+
+.result__name em, .result__type em {
+ font-style: normal;
+ background: rgba(143, 187, 237, .1);
+ box-shadow: inset 0 -1px 0 0 rgba(69, 142, 225, .8);
+}
+
+.result__type em {
+ background: rgba(143, 187, 237, .1);
+ border-radius: 0;
+ box-shadow: inset 0 -1px 0 0 rgba(69, 142, 225, .8);
+}
+
+.result__price {
+ font-size: 25px;
+ font-weight: bold;
+ position: absolute;
+ right: 20px;
+ bottom: 16px;
+}
+
+.result__type {
+ color: #a2a2a2;
+ font-size: 12px;
+}
+
+.result__rating {
+ margin-top: 10px;
+}
+
+.result__star {
+ width: 1em;
+ height: 1em;
+}
+
+.result__star:before {
+ content: '\2605';
+ color: #FBAE00;
+}
+
+.result__star--empty:before {
+ content: '\2606';
+ color: #FBAE00;
+}