diff --git a/dist/system/tokens/tokens.sass b/dist/system/tokens/tokens.sass
new file mode 100644
index 00000000..8a3c3c2c
--- /dev/null
+++ b/dist/system/tokens/tokens.sass
@@ -0,0 +1,61 @@
+
+$color-ucla-gold: rgb(255, 186, 10)
+$color-ucla-gold-darker: rgb(179, 128, 0)
+$color-vermilion-lighter: rgb(244, 151, 138)
+$color-vermilion-darker: rgb(154, 31, 14)
+$color-ucla-gold-lighter: rgb(255, 219, 128)
+$color-bleu-de-france-dark: rgb(16, 112, 209)
+$color-bleu-de-france-light: rgb(84, 163, 242)
+$color-silver: rgb(127, 136, 145)
+$color-white: rgb(255, 255, 255)
+$color-bleu-de-france: rgb(37, 138, 239)
+$color-bleu-de-france-darker: rgb(12, 87, 161)
+$color-bleu-de-france-lighter: rgb(132, 189, 246)
+$color-ucla-gold-dark: rgb(230, 164, 0)
+$color-vermilion-light: rgb(239, 101, 82)
+$color-vermilion-dark: rgb(201, 40, 19)
+$color-ucla-gold-light: rgb(255, 204, 77)
+$color-rich-black: rgb(0, 17, 35)
+$color-cloud: rgb(233, 243, 253)
+$color-oxford-blue: rgb(0, 38, 77)
+$color-vermilion: rgb(235, 59, 36)
+$size-xxxl: 64px
+$size-xxl: 48px
+$size-xl: 36px
+$size-l: 24px
+$size-m: 16px
+$size-s: 13px
+$size-xs: 11px
+$font-heading: 'Fira Sans', Helvetica, Arial, sans-serif
+$font-text: 'Fira Sans', Helvetica, Arial, sans-serif
+$weight-bold: 700
+$weight-semi-bold: 600
+$weight-normal: 400
+$weight-light: 300
+$opacity-disabled: 0.5
+$height-footer: 64px
+$tappable-square: 44px
+$duration-quickly: 0.08s
+$duration-slowly: 0.5s
+$z-index-modal: 9999
+$z-index-sticky: 100
+$media-query-m: (min-width: 768px)
+$media-query-l: (min-width: 1024px)
+$shadow-s: 0 0 0 1px rgba(92,106,196,.1)
+$spacing-xl: 2px
+$spacing-l: 1px
+$spacing-m: 0
+$spacing-s: -0.5px
+$spacing-xs: -1px
+$radius-default: 3px
+$radius-circle: 50%
+$space-xxl: 128px
+$space-xl: 64px
+$space-l: 48px
+$space-m: 24px
+$space-s: 16px
+$space-xs: 8px
+$space-xxs: 4px
+$line-height-m: 1.6
+$line-height-s: 1.3
+$line-height-xs: 1