diff --git a/sass/components/_setsymbol.scss b/sass/components/_setsymbol.scss
new file mode 100644
index 0000000..d9ff293
--- /dev/null
+++ b/sass/components/_setsymbol.scss
@@ -0,0 +1,27 @@
+// set symbol class
+.#{$keyrune_prefix} {
+  display: $setsymbol_display;
+  font: $setsymbol_font;
+  font-size: $setsymbol_font_size;
+  line-height: $setsymbol_line_height;
+  text-rendering: $setsymbol_text_rendering;
+  transform: $setsymbol_transform;
+  speak: $setsymbol_speak;
+  text-transform: $setsymbol_text_transform;
+  vertical-align: $setsymbol_vertical_align;
+  // Better font rendering
+  -webkit-font-smoothing: $setsymbol_webkit_font_smoothing;
+  -moz-font-smoothing: $setsymbol_moz_font_smoothing;
+
+  // default symbol if the set does not exist yet, or setcode does not match
+  &:before {
+    content: $setsymbol_default_content;
+  }
+}
+
+// set symbol size modifier classes
+@each $size in $symbol_sizes {
+  .#{$keyrune_prefix}.#{nth($size, 1)} {
+    font-size: #{nth($size, 2)}
+  }
+}
diff --git a/sass/components/_typography.scss b/sass/components/_typography.scss
new file mode 100644
index 0000000..42f523e
--- /dev/null
+++ b/sass/components/_typography.scss
@@ -0,0 +1,11 @@
+@font-face {
+  font-family: "#{$keyrune_font_face}";
+  src:url( '#{$global_font_path}/keyrune.eot?v=#{$keyrune_version}' );
+  src:url( '#{$global_font_path}/keyrune.eot?#iefix&v=#{$keyrune_version}' ) format( 'embedded-opentype' ),
+      url( '#{$global_font_path}/keyrune.woff2?v=#{$keyrune_version}' ) format( 'woff2' ),
+      url( '#{$global_font_path}/keyrune.woff?v=#{$keyrune_version}' ) format( 'woff' ),
+      url( '#{$global_font_path}/keyrune.ttf?v=#{$keyrune_version}' ) format( 'truetype' ),
+      url( '#{$global_font_path}/keyrune.svg?v=#{$keyrune_version}#keyrune' ) format( 'svg' );
+  font-weight: normal;
+  font-style: normal;
+}
diff --git a/sass/config/_settings.scss b/sass/config/_settings.scss
new file mode 100644
index 0000000..ba6ac8b
--- /dev/null
+++ b/sass/config/_settings.scss
@@ -0,0 +1 @@
+// this is a generated copy of _variables.scss for users.
diff --git a/sass/config/_variables.scss b/sass/config/_variables.scss
new file mode 100644
index 0000000..c43afd6
--- /dev/null
+++ b/sass/config/_variables.scss
@@ -0,0 +1,54 @@
+// _variables.scss
+
+// Table of Contents: ===========================
+// 1. Global
+// 2. Keyrune
+// 3. Symbol Sizes
+// 4. Rarity Colors
+// 5. Set Symbol
+// 6. MtG Setlist
+
+// 1. Global ====================================
+$global_font_path:  '../fonts' !default;
+$global_font_size:  14px !default;
+
+// 2. Keyrune ===================================
+$keyrune_font_face:               "Keyrune" !default;
+$keyrune_version:                 '1.7.2' !default;
+$keyrune_prefix:                  'ss' !default;
+
+// 3. Symbol Sizes ==============================
+$symbol_sizes: (
+  '2x': 2em,
+  '3x': 3em,
+  '4x': 4em,
+  '5x': 5em,
+  '6x': 6em
+) !default;
+
+// 4. Rarity Colors =============================
+$rarity_palette: (
+  ('common', #1a1718, #302b2c, #474040, #000),
+  ('uncommon', #707883, #5a6572, #9e9e9e, #111),
+  ('rare', #a58e4a, #876a3b, #dfbd6b, #333),
+  ('mythic', #bf4427, #b21f0f, #f38300, #333)
+) !default;
+
+// 5. Set Symbol ================================
+$setsymbol_display:                 inline-block !default;
+$setsymbol_font:                    normal normal normal $global_font_size/1 $keyrune_font_face !default;
+$setsymbol_font_size:               inherit !default;
+$setsymbol_line_height:             1em !default;
+$setsymbol_text_rendering:          auto !default;
+$setsymbol_transform:               translate(0, 0) !default;
+$setsymbol_speak:                   none !default;
+$setsymbol_text_transform:          none !default;
+$setsymbol_vertical_align:          middle !default;
+$setsymbol_webkit_font_smoothing:   antialiased !default;
+$setsymbol_moz_font_smoothing:      grayscale !default;
+$setsymbol_default_content:         "\e684" !default;
+
+// MtG Setlist ===================================
+$mtg_setlist: (
+
+) !default;
diff --git a/sass/keyrune.scss b/sass/keyrune.scss
new file mode 100644
index 0000000..c47971c
--- /dev/null
+++ b/sass/keyrune.scss
@@ -0,0 +1,9 @@
+// keyrune.scss
+
+// Config ==============
+@import 'config/variables';
+//@import 'config/settings'; // used for other users to overwrite default styles.
+
+// Components ==========
+@import 'components/typography';
+@import 'components/setsymbol';