diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..8dc20ad
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,4 @@
+.idea
+.DS_Store
+.sass-cache
+node_modules
\ No newline at end of file
diff --git a/README.md b/README.md
new file mode 100644
index 0000000..a3b7d0e
--- /dev/null
+++ b/README.md
@@ -0,0 +1,88 @@
+# SassyBreakpoint
+
+A simple ***breakpoint mixin*** is just all you need!
+
+### Required
+
+- Sass 3.3 and up
+
+
+### Settings
+```scss
+// _Variables.scss
+// based on Foundation 5 Framework
+
+$sf-screen: "only screen" !default;
+
+$sf-small-up: $sf-screen !default;
+$sf-small-only: "#{$sf-screen} and (max-width: #{upper-bound($sf-small-range)})" !default;
+
+$sf-medium-up: "#{$sf-screen} and (min-width:#{lower-bound($sf-medium-range)})" !default;
+$sf-medium-only: "#{$sf-screen} and (min-width:#{lower-bound($sf-medium-range)}) and (max-width:#{upper-bound($sf-medium-range)})" !default;
+
+$sf-large-up: "#{$sf-screen} and (min-width:#{lower-bound($sf-large-range)})" !default;
+$sf-large-only: "#{$sf-screen} and (min-width:#{lower-bound($sf-large-range)}) and (max-width:#{upper-bound($sf-large-range)})" !default;
+
+$sf-breakpoints: (
+    "small": $sf-small-up,
+    "small-only": $sf-small-only,
+
+    "medium": $sf-medium-up,
+    "medium-only": $sf-medium-only,
+
+    "large": $sf-large-up,
+    "large-only": $sf-large-only
+) !default;
+
+```
+
+
+### How to use
+
+Scss:
+```scss
+// create 3 breakpoints for aside
+aside {
+  @include sf-breakpoint("small-only"){
+      width: 100%;
+      content: "small-only";
+  }
+  @include sf-breakpoint("medium-only"){
+      width: 80%;
+      content: "medium-only";
+  }
+  @include sf-breakpoint("large-only"){
+      width: 30%;
+      content: "large-only";
+  }
+}
+```
+Output:
+```css
+  @media only screen and (max-width: 40em) {
+    aside {
+      width: 100%;
+      content: "small-only"; 
+    } 
+  }
+  @media only screen and (min-width: 40.063em) and (max-width: 64em) {
+    aside {
+      width: 80%;
+      content: "medium-only";
+    } 
+  }
+  @media only screen and (min-width: 64.063em) and (max-width: 90em) {
+    aside {
+      width: 30%;
+      content: "large-only";
+    } 
+   }
+```
+
+### SassyBreakpoint + SassyPlaceholder
+You can extend any placeholder on different directive when combining it with SassyPlaceholder.
+
+
+### License
+
+The SassyBreakpoint is open-sourced software licensed under the [MIT license](http://opensource.org/licenses/MIT)
\ No newline at end of file
diff --git a/Test/test.css b/Test/test.css
new file mode 100644
index 0000000..7399514
--- /dev/null
+++ b/Test/test.css
@@ -0,0 +1,16 @@
+aside {
+  content: "root"; }
+  @media only screen and (max-width: 40em) {
+    aside {
+      width: 100%;
+      content: "small-only"; } }
+  @media only screen and (min-width: 40.063em) and (max-width: 64em) {
+    aside {
+      width: 100%;
+      content: "medium-only"; } }
+  @media only screen and (min-width: 64.063em) and (max-width: 90em) {
+    aside {
+      width: 30%;
+      content: "large-only"; } }
+
+/*# sourceMappingURL=test.css.map */
diff --git a/Test/test.css.map b/Test/test.css.map
new file mode 100644
index 0000000..d17ae56
--- /dev/null
+++ b/Test/test.css.map
@@ -0,0 +1,7 @@
+{
+"version": 3,
+"mappings": "AAEA,KAAM;EACJ,OAAO,EAAE,MAAM;ECOb,wCAAgB;IDRpB,KAAM;MAGA,KAAK,EAAE,IAAI;MACX,OAAO,EAAE,YAAY;ECIvB,kEAAgB;IDRpB,KAAM;MAOA,KAAK,EAAE,IAAI;MACX,OAAO,EAAE,aAAa;ECAxB,kEAAgB;IDRpB,KAAM;MAWA,KAAK,EAAE,GAAG;MACV,OAAO,EAAE,YAAY",
+"sources": ["test.scss","../_Mixins.scss"],
+"names": [],
+"file": "test.css"
+}
\ No newline at end of file
diff --git a/Test/test.scss b/Test/test.scss
new file mode 100644
index 0000000..ef2b7ae
--- /dev/null
+++ b/Test/test.scss
@@ -0,0 +1,18 @@
+@import "../SassyBreakpoint";
+
+aside {
+  content: "root";
+  @include sf-breakpoint("small-only"){
+      width: 100%;
+      content: "small-only";
+  }
+  @include sf-breakpoint("medium-only"){
+      width: 100%;
+      content: "medium-only";
+  }
+  @include sf-breakpoint("large-only"){
+      width: 30%;
+      content: "large-only";
+  }
+}
+
diff --git a/_Functions.scss b/_Functions.scss
new file mode 100644
index 0000000..cca822e
--- /dev/null
+++ b/_Functions.scss
@@ -0,0 +1,19 @@
+
+// v0.0.1
+
+// Foundation by ZURB
+
+@function lower-bound($range){
+  @if length($range) <= 0 {
+    @return 0;
+  }
+  @return nth($range,1);
+}
+
+
+@function upper-bound($range){
+  @if length($range) < 2 {
+    @return 999999999999;
+  }
+  @return nth($range, 2);
+}
\ No newline at end of file
diff --git a/_Mixins.scss b/_Mixins.scss
new file mode 100644
index 0000000..4efa8d5
--- /dev/null
+++ b/_Mixins.scss
@@ -0,0 +1,20 @@
+
+// v0.0.1
+
+@mixin sf-breakpoint($breakpoint){
+  $value: map-get($sf-breakpoints, $breakpoint);
+
+  @if($value != null){
+    // Set Current Breakpoint
+    $sf-current-breakpoint: $breakpoint !global;
+
+    @media #{$value}{
+      @content;
+    }
+
+    // Reset Breakpoint
+    $sf-current-breakpoint: $sf-default-breakpoint !global;
+  } @else {
+    @error "`#{$breakpoint}` breakpoint is Invalid or it doesn't exists.";
+  }
+}
\ No newline at end of file
diff --git a/_SassyBreakpoint.scss b/_SassyBreakpoint.scss
new file mode 100644
index 0000000..296ae35
--- /dev/null
+++ b/_SassyBreakpoint.scss
@@ -0,0 +1,6 @@
+
+// v0.0.1
+
+@import "Functions";
+@import "Variables";
+@import "Mixins";
\ No newline at end of file
diff --git a/_Variables.scss b/_Variables.scss
new file mode 100644
index 0000000..f3bf298
--- /dev/null
+++ b/_Variables.scss
@@ -0,0 +1,46 @@
+
+// v0.0.1
+
+
+$sf-default-breakpoint: root !default;
+$sf-current-breakpoint: $sf-default-breakpoint !global;
+
+// Based on Foundation 5 Framework
+
+$sf-small-range: (0em, 40em) !default;
+$sf-medium-range: (40.063em, 64em) !default;
+$sf-large-range: (64.063em, 90em) !default;
+$sf-xlarge-range: (90.063em, 120em) !default;
+$sf-xxlarge-range: (120.063em, 99999999em) !default;
+
+$sf-screen: "only screen" !default;
+
+$sf-landscape: "#{$sf-screen} and (orientation: landscape)" !default;
+$sf-portrait: "#{$sf-screen} and (orientation: portrait)" !default;
+
+$sf-small-up: $sf-screen !default;
+$sf-small-only: "#{$sf-screen} and (max-width: #{upper-bound($sf-small-range)})" !default;
+
+$sf-medium-up: "#{$sf-screen} and (min-width:#{lower-bound($sf-medium-range)})" !default;
+$sf-medium-only: "#{$sf-screen} and (min-width:#{lower-bound($sf-medium-range)}) and (max-width:#{upper-bound($sf-medium-range)})" !default;
+
+$sf-large-up: "#{$sf-screen} and (min-width:#{lower-bound($sf-large-range)})" !default;
+$sf-large-only: "#{$sf-screen} and (min-width:#{lower-bound($sf-large-range)}) and (max-width:#{upper-bound($sf-large-range)})" !default;
+
+$sf-xlarge-up: "#{$sf-screen} and (min-width:#{lower-bound($sf-xlarge-range)})" !default;
+$sf-xlarge-only: "#{$sf-screen} and (min-width:#{lower-bound($sf-xlarge-range)}) and (max-width:#{upper-bound($sf-xlarge-range)})" !default;
+
+$sf-xxlarge-up: "#{$sf-screen} and (min-width:#{lower-bound($sf-xxlarge-range)})" !default;
+$sf-xxlarge-only: "#{$sf-screen} and (min-width:#{lower-bound($sf-xxlarge-range)}) and (max-width:#{upper-bound($sf-xxlarge-range)})" !default;
+
+
+$sf-breakpoints: (
+    "small": $sf-small-up,
+    "small-only": $sf-small-only,
+
+    "medium": $sf-medium-up,
+    "medium-only": $sf-medium-only,
+
+    "large": $sf-large-up,
+    "large-only": $sf-large-only
+) !default;
\ No newline at end of file
diff --git a/bower.json b/bower.json
new file mode 100644
index 0000000..3285e7b
--- /dev/null
+++ b/bower.json
@@ -0,0 +1,24 @@
+{
+  "name": "SassyBreakpoint",
+  "version": "0.0.1",
+  "authors": [
+    "johngerome <johngerome@gmail.com>"
+  ],
+  "description": "A simple breakpoint mixin is just all you need!",
+  "main": "_SassyBreakpoint.scss",
+  "keywords": [
+    "sass",
+    "breakpoint",
+    "css",
+    "sassyframework"
+  ],
+  "license": "MIT",
+  "homepage": "https://github.com/SassyFramework/SassyBreakpoint",
+  "ignore": [
+    "**/.*",
+    "node_modules",
+    "bower_components",
+    "test",
+    "tests"
+  ]
+}
diff --git a/sass-watch-test.sh b/sass-watch-test.sh
new file mode 100755
index 0000000..96c07c5
--- /dev/null
+++ b/sass-watch-test.sh
@@ -0,0 +1 @@
+sass --watch Test
\ No newline at end of file