diff --git a/examples/compass/compass.html b/examples/compass/compass.html
new file mode 100644
index 00000000..58ced438
--- /dev/null
+++ b/examples/compass/compass.html
@@ -0,0 +1,19 @@
+<html>
+  <head>
+    <title>Compass Example</title>
+    <link rel="stylesheet" href="stylesheets/compass.css" type="text/css" media="screen, projection">
+  </head>
+  <body>
+    <div class="compass">
+      <div class="n"><p>North</p></div>
+      <div class="n e"><p>North<br/>East</p></div>
+      <div class="e"><p>East</p></div>
+      <div class="s e"><p>South<br/>East</p></div>
+      <div class="s"><p>South</p></div>
+      <div class="s w"><p>South<br/>West</p></div>
+      <div class="w"><p>West</p></div>
+      <div class="n w"><p>North<br/>West</p></div>
+    </div>
+  </body>
+</html>
+      
\ No newline at end of file
diff --git a/examples/compass/stylesheets/compass.sass b/examples/compass/stylesheets/compass.sass
new file mode 100644
index 00000000..9a96490e
--- /dev/null
+++ b/examples/compass/stylesheets/compass.sass
@@ -0,0 +1,47 @@
+=compass(!s)
+  :position relative
+  :width= 4 * !s
+  :height= 4 * !s
+  :font-size 24px
+  :font-family "Academy Engraved LET", "Papyrus"
+  .n, .s, .e, .w
+    :position absolute
+    :width= !s
+    :height= !s
+    :text-align center
+    :vertical-align middle
+  .w
+    :left 0px
+  .n.w, .s.w
+    :left= 0.5 * !s
+  .n, .s
+    :left=  1.5 * !s
+  .n.e, .s.e
+    :left= 2.5 * !s
+  .e
+    :left= 3 * !s
+  .n
+    :top 0px
+  .n.w, .n.e
+    :top= 0.5 * !s
+  .w, .e
+    :top= 1.5 * !s
+  .s.w, .s.e
+    :top= 2.5 * !s
+  .s
+    :top= 3 * !s
+
+.compass
+  :margin 1em auto
+  +compass(4em)
+  .n, .s, .e, .w
+    p
+      :margin
+        :top 1.5em
+        :bottom 1.5em
+  .n.w, .s.w, .n.e, .s.e
+    p
+      :margin
+        :top 1em
+        :bottom 1em
+  
\ No newline at end of file
