diff --git a/assets/css/colors.css b/assets/css/colors.css
new file mode 100644
index 0000000..b934a6a
--- /dev/null
+++ b/assets/css/colors.css
@@ -0,0 +1,109 @@
+:root {
+ /* COLORS */
+ --red: #EF5255;
+ --red1: #BF3638;
+ --red2: #D5484A;
+ --red3: #EF5255;
+ --red4: #FA7A7C;
+ --red5: #FA999A;
+
+ --orange: #EB801B;
+ --orange1: #AF6118;
+ --orange2: #DA7516;
+ --orange3: #EB801B;
+ --orange4: #F99434;
+ --orange5: #F9AE67;
+
+ --yellow: #F4C025;
+ --yellow1: #BD920F;
+ --yellow2: #DFAC11;
+ --yellow3: #F4C025;
+ --yellow4: #FFD147;
+ --yellow5: #FFE38F;
+
+ --pear: #AED651;
+ --pear1: #7D9A37;
+ --pear2: #96BB3E;
+ --pear3: #AED651;
+ --pear4: #C2E571;
+ --pear5: #DBF1A7;
+
+ --green: #72D661;
+ --green1: #53A545;
+ --green2: #61C350;
+ --green3: #72D661;
+ --green4: #93E684;
+ --green5: #BCF0B2;
+
+ --sea: #3DDF89;
+ --sea1: #2AA764;
+ --sea2: #2ACB75;
+ --sea3: #3DDF89;
+ --sea4: #5DEEA1;
+ --sea5: #A9F4CC;
+
+ --cyan: #4CDCDF;
+ --cyan1: #2CA3A5;
+ --cyan2: #2DCACD;
+ --cyan3: #4CDCDF;
+ --cyan4: #6BE8EB;
+ --cyan5: #B7EFF0;
+
+ --blue: #4C9CEF;
+ --blue1: #1C67B5;
+ --blue2: #2A83DF;
+ --blue3: #4C9CEF;
+ --blue4: #74B6FB;
+ --blue5: #A3CEFA;
+
+ --indigo: #4C6DEF;
+ --indigo1: #2143CA;
+ --indigo2: #3457E5;
+ --indigo3: #4C6DEF;
+ --indigo4: #748FFB;
+ --indigo5: #B1C0FC;
+
+ --purple: #967CF4;
+ --purple1: #613FD9;
+ --purple2: #7C5DE9;
+ --purple3: #967CF4;
+ --purple4: #BCAAFD;
+ --purple5: #CFC2FE;
+
+ --magenta: #E175DB;
+ --magenta1: #B63AB0;
+ --magenta2: #D152CB;
+ --magenta3: #E175DB;
+ --magenta4: #EC9AEF;
+ --magenta5: #EFB1F1;
+
+ --pink: #EE588F;
+ --pink1: #D0356D;
+ --pink2: #E2407C;
+ --pink3: #EE588F;
+ --pink4: #FA80AC;
+ --pink5: #FBA7C6;
+
+ --grey1: #00001F;
+ --grey2: #10102F;
+ --grey3: #20203F;
+ --grey4: #30304F;
+ --grey5: #40405F;
+ --grey6: #50506F;
+ --grey7: #60607F;
+ --grey8: #70708F;
+ --grey9: #80809F;
+ --grey10: #9090AF;
+ --grey11: #A0A0BF;
+ --grey12: #B0B0CF;
+ --grey13: #C0C0DF;
+ --grey14: #D0D0EF;
+ --grey15: #E0E0FF;
+
+ /* ALIASES */
+ --primary: var(--sea);
+ --accent: var(--cyan);
+ --accent2: var(--blue);
+ --surface: var(--grey2);
+ --text: var(--grey15);
+}
\ No newline at end of file
diff --git a/assets/css/scaling.css b/assets/css/scaling.css
new file mode 100644
index 0000000..07e45cb
--- /dev/null
+++ b/assets/css/scaling.css
@@ -0,0 +1,66 @@
+@media screen and (min-width: 1px) {
+ :root {
+ font-size: 12px;
+ }
+
+}
+@media screen and (min-width: 300px) {
+ :root {
+ font-size: 13pt;
+ }
+}
+@media screen and (min-width: 400px) {
+ :root {
+ font-size: 14pt;
+ }
+}
+@media screen and (min-width: 500px) {
+ :root {
+ font-size: 15pt;
+ }
+}
+@media screen and (min-width: 600px) {
+ :root {
+ font-size: 16pt;
+ }
+}
+@media screen and (min-width: 700px) {
+ :root {
+ font-size: 17pt;
+ }
+}
+@media screen and (min-width: 802px) {
+ :root {
+ font-size: 12pt;
+ }
+}
+@media screen and (min-width: 1000px) {
+ :root {
+ font-size: 13pt;
+ }
+}
+@media screen and (min-width: 1200px) {
+ :root {
+ font-size: 14pt;
+ }
+}
+@media screen and (min-width: 1500px) {
+ :root {
+ font-size: 15pt;
+ }
+}
+@media screen and (min-width: 1800px) {
+ :root {
+ font-size: 16pt;
+ }
+}
+@media screen and (min-width: 2500px) {
+ :root {
+ font-size: 17pt;
+ }
+}
+@media screen and (min-width: 3000px) {
+ :root {
+ font-size: 19pt;
+ }
+}
diff --git a/assets/css/theme.css b/assets/css/theme.css
new file mode 100644
index 0000000..f1e3a1d
--- /dev/null
+++ b/assets/css/theme.css
@@ -0,0 +1,119 @@
+* {
+ margin: 0;
+ padding: 0;
+ border: 0 none transparent;
+
+ box-sizing: border-box;
+ scroll-behavior: smooth;
+
+ font-family: 'sans-serif';
+ font-size: .85rem;
+ line-height: 1.5;
+
+ color: var(--text);
+}
+
+html {
+ display: grid;
+ place-items: center;
+ width: 100%;
+ background-color: var(--surface);
+}
+
+body {
+ margin: 5vh 0 10vh 0;
+ width: min(95vw, 75ch);
+}
+
+header {
+ color: var(--primary);
+ font-size: 3rem;
+ text-align: center;
+}
+
+h1, h2, h3, h4, h5, h6 {
+ color: var(--accent);
+ font-weight: normal;
+
+ margin: .25em 0 .15em 0;
+}
+
+h1 {
+ color: var(--primary);
+ font-size: 2rem;
+}
+
+h2 {
+ font-size: 1.75rem;
+}
+
+h3 {
+ font-size: 1.5rem;
+}
+
+h4 {
+ font-size: 1.25rem;
+}
+
+h5 {
+ font-size: 1rem;
+}
+
+h6 {
+ font-size: .85rem;
+}
+
+p {
+ margin: .5em 0 .25em 0;
+}
+
+a {
+ color: var(--accent2);
+}
+
+blockquote {
+ margin: 1rem;
+ padding: .5rem 1rem;
+
+ border-left: .2rem solid var(--primary);
+ background-color: var(--grey3);
+}
+
+ul, ol {
+ margin: 1rem 0 1rem 2rem;
+}
+
+ul ul, ul ol, ol ol, ol ul {
+ margin: .25rem 0 .25rem 1rem;
+}
+
+table {
+ display: block;
+ width: 100%;
+ overflow-x: auto;
+ white-space: nowrap;
+ border-collapse: collapse;
+}
+
+table tbody {
+ display: table;
+ width: 100%;
+}
+
+tr {
+ width: 200%;
+ background-color: var(--grey3);
+}
+
+tr:nth-child(even) {
+ background-color: var(--grey4);
+}
+
+th {
+ border-bottom: .1rem solid var(--text);
+}
+
+th, td {
+ text-align: left;
+ padding: .25rem 1rem;
+}
\ No newline at end of file
diff --git a/content/pages/theme.njk b/content/pages/theme.njk
new file mode 100644
index 0000000..1c28a5d
--- /dev/null
+++ b/content/pages/theme.njk
@@ -0,0 +1,117 @@
+
+
+
+ {% include "templates/defaultTags.njk" %}
+ Document
+
+
+
+
+ Header 1
+ Header 2
+ Header 3
+ Header 4
+ Header 5
+ Header 6
+
+
+ This is a paragraph. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Voluptate non ut commodi quisquam in, a dicta rem expedita tenetur quis ratione aut nesciunt corporis soluta similique eius accusantium, optio numquam? Dolorem, voluptates!
+
+
+
+ Italic text Bold text This is an example link
+
+
+
+ This is a blockquote. Lorem ipsum dolor sit amet consectetur adipisicing elit. Quidem voluptates soluta dolorem esse aperiam natus provident nemo, dicta dolores quae velit officia minus expedita cum modi eveniet minima suscipit mollitia aspernatur ad.
+
+
+
+ This is a list item!
+ This is a list item!
+ This is a list item!
+ This is a list item!
+ This is a list item!
+
+ This is a nested list.
+ This is a nested list.
+ This is a nested list.
+
+ This is a nested list.
+ This is a nested list.
+ This is a nested list.
+
+
+
+
+
+ This is a list item!
+ This is a list item!
+ This is a list item!
+ This is a list item!
+ This is a list item!
+
+ This is a nested list.
+ This is a nested list.
+ This is a nested list.
+
+ This is a nested list.
+ This is a nested list.
+ This is a nested list.
+
+
+
+
+
+
+ Animal
+ Name
+ Age
+
+
+ Bunny
+ Jumpy
+ 2 years
+
+
+ Cat
+ Biter
+ 4 months
+
+
+ Bunny
+ Jumpy
+ 2 years
+
+
+ Cat
+ Biter
+ 4 months
+
+
+ Bunny
+ Jumpy
+ 2 years
+
+
+ Cat
+ Biter
+ 4 months
+
+
+ Bunny
+ Jumpy
+ 2 years
+
+
+ Cat
+ Biter
+ 4 months
+
+
+
+
\ No newline at end of file
diff --git a/content/templates/defaultTags.njk b/content/templates/defaultTags.njk
new file mode 100644
index 0000000..4968956
--- /dev/null
+++ b/content/templates/defaultTags.njk
@@ -0,0 +1,6 @@
+