diff --git a/src/_widths.css b/src/_widths.css
index ddbb560..32c74ee 100644
--- a/src/_widths.css
+++ b/src/_widths.css
@@ -12,6 +12,9 @@
      3 = 3rd step in width scale
      4 = 4th step in width scale
      5 = 5th step in width scale
+     6 = 6th step in width scale
+     7 = 7th step in width scale
+     8 = 8th step in width scale
 
      -10  = literal value 10%
      -20  = literal value 20%
@@ -34,7 +37,7 @@
 
 
    Media Query Extensions:
-     -ns = small
+     -s = small
      -m  = medium
      -l  = large
 
@@ -42,11 +45,15 @@
 
 /* Width Scale */
 
-.w1 {    width: 1rem; }
-.w2 {    width: 2rem; }
-.w3 {    width: 4rem; }
-.w4 {    width: 8rem; }
-.w5 {    width: 16rem; }
+.w0 {    width: var(--size-0, 0); }
+.w1 {    width: var(--size-1, 1rem); }
+.w2 {    width: var(--size-2, 2rem); }
+.w3 {    width: var(--size-3, 3rem); }
+.w4 {    width: var(--size-4, 4rem); }
+.w5 {    width: var(--size-5, 8rem); }
+.w6 {    width: var(--size-6, 16rem); }
+.w7 {    width: var(--size-7, 32rem); }
+.w8 {    width: var(--size-8, 64rem); }
 
 .w-10 {  width:  10%; }
 .w-20 {  width:  20%; }
@@ -60,28 +67,36 @@
 .w-auto { width: auto; }
 
 @media (--breakpoint-small) {
-  .w1-ns {  width: 1rem; }
-  .w2-ns {  width: 2rem; }
-  .w3-ns {  width: 4rem; }
-  .w4-ns {  width: 8rem; }
-  .w5-ns {  width: 16rem; }
-  .w-10-ns { width:  10%; }
-  .w-20-ns { width:  20%; }
-  .w-25-ns { width:  25%; }
-  .w-50-ns { width:  50%; }
-  .w-75-ns { width:  75%; }
-  .w-100-ns { width: 100%; }
-  .w-third-ns { width: calc(100% / 3); }
-  .w-two-thirds-ns { width: calc(100% / 1.5); }
-  .w-auto-ns { width: auto; }
+  .w0-s {    width: var(--size-0, 0); }
+  .w1-s {    width: var(--size-1, 1rem); }
+  .w2-s {    width: var(--size-2, 2rem); }
+  .w3-s {    width: var(--size-3, 3rem); }
+  .w4-s {    width: var(--size-4, 4rem); }
+  .w5-s {    width: var(--size-5, 8rem); }
+  .w6-s {    width: var(--size-6, 16rem); }
+  .w7-s {    width: var(--size-7, 32rem); }
+  .w8-s {    width: var(--size-8, 64rem); }
+  .w-10-s { width:  10%; }
+  .w-20-s { width:  20%; }
+  .w-25-s { width:  25%; }
+  .w-50-s { width:  50%; }
+  .w-75-s { width:  75%; }
+  .w-100-s { width: 100%; }
+  .w-third-s { width: calc(100% / 3); }
+  .w-two-thirds-s { width: calc(100% / 1.5); }
+  .w-auto-s { width: auto; }
 }
 
 @media (--breakpoint-medium) {
-  .w1-m {      width: 1rem; }
-  .w2-m {      width: 2rem; }
-  .w3-m {      width: 4rem; }
-  .w4-m {      width: 8rem; }
-  .w5-m {      width: 16rem; }
+  .w0-m {    width: var(--size-0, 0); }
+  .w1-m {    width: var(--size-1, 1rem); }
+  .w2-m {    width: var(--size-2, 2rem); }
+  .w3-m {    width: var(--size-3, 3rem); }
+  .w4-m {    width: var(--size-4, 4rem); }
+  .w5-m {    width: var(--size-5, 8rem); }
+  .w6-m {    width: var(--size-6, 16rem); }
+  .w7-m {    width: var(--size-7, 32rem); }
+  .w8-m {    width: var(--size-8, 64rem); }
   .w-10-m { width:  10%; }
   .w-20-m { width:  20%; }
   .w-25-m { width:  25%; }
@@ -94,11 +109,15 @@
 }
 
 @media (--breakpoint-large) {
-  .w1-l {      width: 1rem; }
-  .w2-l {      width: 2rem; }
-  .w3-l {      width: 4rem; }
-  .w4-l {      width: 8rem; }
-  .w5-l {      width: 16rem; }
+  .w0-l {    width: var(--size-0, 0); }
+  .w1-l {    width: var(--size-1, 1rem); }
+  .w2-l {    width: var(--size-2, 2rem); }
+  .w3-l {    width: var(--size-3, 3rem); }
+  .w4-l {    width: var(--size-4, 4rem); }
+  .w5-l {    width: var(--size-5, 8rem); }
+  .w6-l {    width: var(--size-6, 16rem); }
+  .w7-l {    width: var(--size-7, 32rem); }
+  .w8-l {    width: var(--size-8, 64rem); }
   .w-10-l {    width:  10%; }
   .w-20-l {    width:  20%; }
   .w-25-l {    width:  25%; }