Replace 0.x colors with rough draft of 1.0 colors

[adamwathan]

This PR replaces the current 7-shade-darkest-to-lightest color system with a new 9-shade-numeric color system, where 100 is the lightest shade, and 900 is the darkest shade.

  colors: {
    // ...
-   'red-darkest': '#3b0d0c',
-   'red-darker': '#621b18',
-   'red-dark': '#cc1f1a',
-   'red': '#e3342f',
-   'red-light': '#ef5753',
-   'red-lighter': '#f9acaa',
-   'red-lightest': '#fcebea',
+   red: {
+     100: '#fff5f5',
+     200: '#fee3e3',
+     300: '#febcbc',
+     400: '#fd9292',
+     500: '#f95e5f',
+     600: '#ec454e',
+     700: '#dc3448',
+     800: '#b4203b',
+     900: '#801b33',
+   },
    // ...
  }

The old black color has also been replaced with real black (#000), as previously we were using it sort of like a hack to fit one additional grey shade, since 7 wasn't quite enough. Now that we have 9 shades per color, we have room for proper black.

These colors will absolutely 100% change, but the names are at least correct, and the colors are probably ~close. Hoping to finish fine-tuning these by the end of the week.

Examples of things I already know we need to adjust:

• The darkest purple and pink are too saturated.
• Some of the middle shades (500) are a little washed out, red for example. Needs to feel a little more "solid".
• Indigo-300 and Blue-300 are a bit dark, need to make them feel more balanced/harmonious with the other 300s
• ...probably a bunch more.

[lukebennett88]

Is there a good reason why the colours have a 3 digit number instead of 1 (other than that material design does it that way?)
I feel like the extra zeros are unnecessary.

[sandren]

Is there a good reason why the colours have a 3 digit number instead of 1 (other than that material design does it that way?)

It's the same scale that vanilla CSS already uses for font weights and it makes it easier to introduce intermediate values if necessary.

[lukebennett88]

Cool makes sense @sandren 😊

[adamwathan]

Updated the colors again to match our latest revision, I think we're "done" but will see how they fair in the wild during our brief alpha period that should hopefully start today :)

[brandontamm]

Nice!! I really like this approach! Now I've just got to swap some things :)

[danfascia]

Also the system used by material design which gives it further familiarity. I like the numerical weighting system.