chore(colors): add initial brand color set

[dancormier]

SPARK-134

---

This PR adds a set of brand colors purely as CSS custom properties. See https://deploy-preview-2093--stacks.netlify.app/product/foundation/colors/#brand

TODO

• Cleanup docs (consider splitting brand colors into color groups like blue green, etc)

Verify

• Do we just need custom properties or do we also need to expose them as utility classes (.bg-brand-green, .fc-brand-off-black, etc)?
• Do we have values for the dark mode versions (and do we need HC versions as well)
• Will we need to consider color contrast for these colors?
  • "These colors would be used by Brand only — ideally they are checking color contrast for their site but I think in most cases it's for illustrations and logos so that's fine." - @CGuindon (slack)
• How solidified is this list of colors? Should we anticipate more colors added?
• Should we reconsider the naming structure?
• YAGNI?
  • Do we need --brand-black? (It's almost exactly --black-600)
  • Do we need --brand-white? (It's exactly --white)
• Reconsider naming accuracy
  • Can we name --stack-orange as just --brand (it would be the default brand color)?
  • Should orange-medium be red instead?
  • Should orange-dark be red-dark instead?
  • Should pink instead be light-pink instead?
  • Should purple be purple-light instead?
  • Should purple-dark be purple instead?

[changeset-bot]

⚠️ No Changeset found

Latest commit: 6aad206

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[netlify]

✅ Deploy Preview for stacks ready!

Name	Link
🔨 Latest commit	6aad206
🔍 Latest deploy log	https://app.netlify.com/projects/stacks/deploys/693325df62ef2400082aabbc
😎 Deploy Preview	https://deploy-preview-2093--stacks.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[netlify]

✅ Deploy Preview for stacks-svelte ready!

Name	Link
🔨 Latest commit	6aad206
🔍 Latest deploy log	https://app.netlify.com/projects/stacks-svelte/deploys/693325df1e0dfe000858d6f9
😎 Deploy Preview	https://deploy-preview-2093--stacks-svelte.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.