@adobe/spectrum-tokens 13.0.0-beta.1 → 13.0.0-beta.11

package/CHANGELOG.md

@@ -1,5 +1,1442 @@
 # @adobe/spectrum-tokens
 
+## 13.0.0-beta.11
+
+### Minor Changes
+
+- 3c6303a: Updated text-to-visual-300 mobile value from 11px to 10px.
+
+  ## Design Motivation
+
+  To better follow our logarithmic scale rounding principle.
+
+  ## Token Diff
+
+  _Token values updated (1):_
+
+  - `text-to-visual-300`
+
+- 6579966: existing corner-radius tokens, adding net-new global corner radius tokens, and introducing new alias names that point to these global values.
+
+  ## Design Motivation
+
+  More on Spectrum 2 rounding: https://s2.spectrum.corp.adobe.com/page/object-styles/#rounding
+
+  In Spectrum 2, rounding also applies to the different t-shirt sized components and varies based on a Major Second logarithmic scale, rounded to whole numbers to avoid using half-pixels. This allows for components to retain a consistent and identifiable shape at all sizes. Because of this there are now component size specific tokens like corner-radius-small-size-medium or corner-radius-medium-size-extra-large to help us keep track of the nuance within t-shirt sizes.
+
+  ## Token Diff
+
+  _Tokens added (23):_
+
+  - `corner-radius-0`
+  - `corner-radius-300`
+  - `corner-radius-400`
+  - `corner-radius-500`
+  - `corner-radius-600`
+  - `corner-radius-700`
+  - `corner-radius-800`
+  - `corner-radius-1000`
+  - `corner-radius-extra-large-default`
+  - `corner-radius-full`
+  - `corner-radius-large-default`
+  - `corner-radius-medium-default`
+  - `corner-radius-medium-size-extra-small`
+  - `corner-radius-medium-size-small`
+  - `corner-radius-medium-size-medium`
+  - `corner-radius-medium-size-large`
+  - `corner-radius-medium-size-extra-large`
+  - `corner-radius-none`
+  - `corner-radius-small-default`
+  - `corner-radius-small-size-small`
+  - `corner-radius-small-size-medium`
+  - `corner-radius-small-size-large`
+  - `corner-radius-small-size-extra-large`
+
+  _Token values updated (3):_
+
+  - `corner-radius-75`
+  - `corner-radius-100`
+  - `corner-radius-200`
+
+## 13.0.0-beta.10
+
+### Minor Changes
+
+- 23d9085: Updated desktop and mobile values for component-edge-to-visual-only tokens.
+
+  Spacing changed due to new workflow icon sizes.
+
+  ## Token Diff
+
+  _Token values updated (5):_
+
+  - `component-edge-to-visual-only-100`
+  - `component-edge-to-visual-only-200`
+  - `component-edge-to-visual-only-300`
+  - `component-edge-to-visual-only-50`
+  - `component-edge-to-visual-only-75`
+
+- c5430b7: Updated help-text-top-to-workflow-icon-_ token values to point to component-top-to-workflow-icon-_ tokens
+
+  ## Token Diff
+
+  _Newly deprecated tokens (4):_
+
+  - `help-text-top-to-workflow-icon-extra-large`: use `component-edge-to-visual-only-300`
+  - `help-text-top-to-workflow-icon-large`: use `component-edge-to-visual-only-200`
+  - `help-text-top-to-workflow-icon-medium`: use `component-edge-to-visual-only-100`
+  - `help-text-top-to-workflow-icon-small`: use `component-edge-to-visual-only-75`
+
+## 13.0.0-beta.9
+
+### Minor Changes
+
+- cf09c84: Updated workflow-icon-size-50, 75, 100, 200, 300 with Spectrum 2 values in mobile and desktop.
+  Updated component-top-to-workflow and text-to-visual padding.
+  Added 3 new non-color tokens for S2 component downstates in Tokens Studio.
+
+  ## Design Motivation
+
+  Spectrum 2 icons have a different workflow icon sizing with base sizes 20 px (desktop), 24 px (mobile).
+
+  Updated padding values due to new workflow icon sizes in S2.
+
+  These tokens are used to calculate the perspective transform in CSS to achieve the effect of a component scaling down for down states in Spectrum 2. This is not applicable to all components.
+
+  ## Tokens Diff
+
+  _Tokens added (3):_
+
+  - `component-size-difference-down`
+  - `component-size-minimum-perspective-down`
+  - `component-size-width-ratio-down`
+
+  _Token values updated (15):_
+
+  - `component-top-to-workflow-icon-100`
+  - `component-top-to-workflow-icon-200`
+  - `component-top-to-workflow-icon-300`
+  - `component-top-to-workflow-icon-50`
+  - `component-top-to-workflow-icon-75`
+  - `text-to-visual-100`
+  - `text-to-visual-200`
+  - `text-to-visual-300`
+  - `text-to-visual-50`
+  - `text-to-visual-75`
+  - `workflow-icon-size-100`
+  - `workflow-icon-size-200`
+  - `workflow-icon-size-300`
+  - `workflow-icon-size-50`
+  - `workflow-icon-size-75`
+
+## 13.0.0-beta.8
+
+### Minor Changes
+
+- 507f3c2: Added new and updating existing background layer tokens to S2 set in Tokens Studio and S2/Variables. Also reordered token organization to reflect proper usage based on [S2 guidelines](https://s2.spectrum.corp.adobe.com/page/background-layers/#editing-contexts).
+
+  ## Design Motivation
+
+  In Spectrum 2, background layers are used differently depending on the primary context of the page. We now have a full set of tokens to help users distinguish between primary purposes, editing vs browsing.
+
+  ## Token Diff
+
+  _Tokens added (2):_
+
+  - `background-elevated-color`
+  - `background-pasteboard-color`
+
+  _Token values updated (1):_
+
+  - `background-base-color`
+
+## 13.0.0-beta.7
+
+### Minor Changes
+
+- 4853f76: Added schema to all tokens and fixed values that didn't meet schema requirements
+
+  ## Token Diff
+
+  _Token values updated (328):_
+
+  - `accent-background-color-default`
+  - `accent-background-color-down`
+  - `accent-background-color-hover`
+  - `accent-background-color-key-focus`
+  - `accent-color-100`
+  - `accent-color-1000`
+  - `accent-color-1100`
+  - `accent-color-1200`
+  - `accent-color-1300`
+  - `accent-color-1400`
+  - `accent-color-200`
+  - `accent-color-300`
+  - `accent-color-400`
+  - `accent-color-500`
+  - `accent-color-600`
+  - `accent-color-700`
+  - `accent-color-800`
+  - `accent-color-900`
+  - `accent-content-color-default`
+  - `accent-content-color-down`
+  - `accent-content-color-hover`
+  - `accent-content-color-key-focus`
+  - `accent-content-color-selected`
+  - `accent-visual-color`
+  - `blue-100`
+  - `blue-1000`
+  - `blue-1100`
+  - `blue-1200`
+  - `blue-1300`
+  - `blue-1400`
+  - `blue-200`
+  - `blue-300`
+  - `blue-400`
+  - `blue-500`
+  - `blue-600`
+  - `blue-700`
+  - `blue-800`
+  - `blue-900`
+  - `blue-background-color-default`
+  - `blue-visual-color`
+  - `celery-100`
+  - `celery-1000`
+  - `celery-1100`
+  - `celery-1200`
+  - `celery-1300`
+  - `celery-1400`
+  - `celery-200`
+  - `celery-300`
+  - `celery-400`
+  - `celery-500`
+  - `celery-600`
+  - `celery-700`
+  - `celery-800`
+  - `celery-900`
+  - `celery-background-color-default`
+  - `celery-visual-color`
+  - `chartreuse-100`
+  - `chartreuse-1000`
+  - `chartreuse-1100`
+  - `chartreuse-1200`
+  - `chartreuse-1300`
+  - `chartreuse-1400`
+  - `chartreuse-200`
+  - `chartreuse-300`
+  - `chartreuse-400`
+  - `chartreuse-500`
+  - `chartreuse-600`
+  - `chartreuse-700`
+  - `chartreuse-800`
+  - `chartreuse-900`
+  - `chartreuse-background-color-default`
+  - `chartreuse-visual-color`
+  - `contextual-help-body-size`
+  - `cyan-100`
+  - `cyan-1000`
+  - `cyan-1100`
+  - `cyan-1200`
+  - `cyan-1300`
+  - `cyan-1400`
+  - `cyan-200`
+  - `cyan-300`
+  - `cyan-400`
+  - `cyan-500`
+  - `cyan-600`
+  - `cyan-700`
+  - `cyan-800`
+  - `cyan-900`
+  - `cyan-background-color-default`
+  - `cyan-visual-color`
+  - `drop-zone-background-color`
+  - `focus-indicator-color`
+  - `fuchsia-100`
+  - `fuchsia-1000`
+  - `fuchsia-1100`
+  - `fuchsia-1200`
+  - `fuchsia-1300`
+  - `fuchsia-1400`
+  - `fuchsia-200`
+  - `fuchsia-300`
+  - `fuchsia-400`
+  - `fuchsia-500`
+  - `fuchsia-600`
+  - `fuchsia-700`
+  - `fuchsia-800`
+  - `fuchsia-900`
+  - `fuchsia-background-color-default`
+  - `fuchsia-visual-color`
+  - `green-100`
+  - `green-1000`
+  - `green-1100`
+  - `green-1200`
+  - `green-1300`
+  - `green-1400`
+  - `green-200`
+  - `green-300`
+  - `green-400`
+  - `green-500`
+  - `green-600`
+  - `green-700`
+  - `green-800`
+  - `green-900`
+  - `green-background-color-default`
+  - `green-visual-color`
+  - `icon-color-blue-primary-default`
+  - `icon-color-green-primary-default`
+  - `icon-color-red-primary-default`
+  - `icon-color-yellow-primary-default`
+  - `indigo-100`
+  - `indigo-1000`
+  - `indigo-1100`
+  - `indigo-1200`
+  - `indigo-1300`
+  - `indigo-1400`
+  - `indigo-200`
+  - `indigo-300`
+  - `indigo-400`
+  - `indigo-500`
+  - `indigo-600`
+  - `indigo-700`
+  - `indigo-800`
+  - `indigo-900`
+  - `indigo-background-color-default`
+  - `indigo-visual-color`
+  - `informative-background-color-default`
+  - `informative-background-color-down`
+  - `informative-background-color-hover`
+  - `informative-background-color-key-focus`
+  - `informative-color-100`
+  - `informative-color-1000`
+  - `informative-color-1100`
+  - `informative-color-1200`
+  - `informative-color-1300`
+  - `informative-color-1400`
+  - `informative-color-200`
+  - `informative-color-300`
+  - `informative-color-400`
+  - `informative-color-500`
+  - `informative-color-600`
+  - `informative-color-700`
+  - `informative-color-800`
+  - `informative-color-900`
+  - `informative-visual-color`
+  - `magenta-100`
+  - `magenta-1000`
+  - `magenta-1100`
+  - `magenta-1200`
+  - `magenta-1300`
+  - `magenta-1400`
+  - `magenta-200`
+  - `magenta-300`
+  - `magenta-400`
+  - `magenta-500`
+  - `magenta-600`
+  - `magenta-700`
+  - `magenta-800`
+  - `magenta-900`
+  - `magenta-background-color-default`
+  - `magenta-visual-color`
+  - `navigational-indicator-top-to-back-icon-extra-large`
+  - `navigational-indicator-top-to-back-icon-large`
+  - `navigational-indicator-top-to-back-icon-medium`
+  - `navigational-indicator-top-to-back-icon-small`
+  - `negative-background-color-default`
+  - `negative-background-color-down`
+  - `negative-background-color-hover`
+  - `negative-background-color-key-focus`
+  - `negative-border-color-default`
+  - `negative-border-color-down`
+  - `negative-border-color-focus`
+  - `negative-border-color-focus-hover`
+  - `negative-border-color-hover`
+  - `negative-border-color-key-focus`
+  - `negative-color-100`
+  - `negative-color-1000`
+  - `negative-color-1100`
+  - `negative-color-1200`
+  - `negative-color-1300`
+  - `negative-color-1400`
+  - `negative-color-200`
+  - `negative-color-300`
+  - `negative-color-400`
+  - `negative-color-500`
+  - `negative-color-600`
+  - `negative-color-700`
+  - `negative-color-800`
+  - `negative-color-900`
+  - `negative-content-color-default`
+  - `negative-content-color-down`
+  - `negative-content-color-hover`
+  - `negative-content-color-key-focus`
+  - `negative-visual-color`
+  - `notice-background-color-default`
+  - `notice-color-100`
+  - `notice-color-1000`
+  - `notice-color-1100`
+  - `notice-color-1200`
+  - `notice-color-1300`
+  - `notice-color-1400`
+  - `notice-color-200`
+  - `notice-color-300`
+  - `notice-color-400`
+  - `notice-color-500`
+  - `notice-color-600`
+  - `notice-color-700`
+  - `notice-color-800`
+  - `notice-color-900`
+  - `notice-visual-color`
+  - `orange-100`
+  - `orange-1000`
+  - `orange-1100`
+  - `orange-1200`
+  - `orange-1300`
+  - `orange-1400`
+  - `orange-200`
+  - `orange-300`
+  - `orange-400`
+  - `orange-500`
+  - `orange-600`
+  - `orange-700`
+  - `orange-800`
+  - `orange-900`
+  - `orange-background-color-default`
+  - `orange-visual-color`
+  - `positive-background-color-default`
+  - `positive-background-color-down`
+  - `positive-background-color-hover`
+  - `positive-background-color-key-focus`
+  - `positive-color-100`
+  - `positive-color-1000`
+  - `positive-color-1100`
+  - `positive-color-1200`
+  - `positive-color-1300`
+  - `positive-color-1400`
+  - `positive-color-200`
+  - `positive-color-300`
+  - `positive-color-400`
+  - `positive-color-500`
+  - `positive-color-600`
+  - `positive-color-700`
+  - `positive-color-800`
+  - `positive-color-900`
+  - `positive-visual-color`
+  - `purple-100`
+  - `purple-1000`
+  - `purple-1100`
+  - `purple-1200`
+  - `purple-1300`
+  - `purple-1400`
+  - `purple-200`
+  - `purple-300`
+  - `purple-400`
+  - `purple-500`
+  - `purple-600`
+  - `purple-700`
+  - `purple-800`
+  - `purple-900`
+  - `purple-background-color-default`
+  - `purple-visual-color`
+  - `red-100`
+  - `red-1000`
+  - `red-1100`
+  - `red-1200`
+  - `red-1300`
+  - `red-1400`
+  - `red-200`
+  - `red-300`
+  - `red-400`
+  - `red-500`
+  - `red-600`
+  - `red-700`
+  - `red-800`
+  - `red-900`
+  - `red-background-color-default`
+  - `red-visual-color`
+  - `seafoam-100`
+  - `seafoam-1000`
+  - `seafoam-1100`
+  - `seafoam-1200`
+  - `seafoam-1300`
+  - `seafoam-1400`
+  - `seafoam-200`
+  - `seafoam-300`
+  - `seafoam-400`
+  - `seafoam-500`
+  - `seafoam-600`
+  - `seafoam-700`
+  - `seafoam-800`
+  - `seafoam-900`
+  - `seafoam-background-color-default`
+  - `seafoam-visual-color`
+  - `side-navigation-item-to-header`
+  - `table-selected-row-background-color`
+  - `yellow-100`
+  - `yellow-1000`
+  - `yellow-1100`
+  - `yellow-1200`
+  - `yellow-1300`
+  - `yellow-1400`
+  - `yellow-200`
+  - `yellow-300`
+  - `yellow-400`
+  - `yellow-500`
+  - `yellow-600`
+  - `yellow-700`
+  - `yellow-800`
+  - `yellow-900`
+  - `yellow-background-color-default`
+  - `yellow-visual-color`
+
+## 13.0.0-beta.6
+
+### Minor Changes
+
+- 6d1c661: Added new Spectrum 2 color tokens for both light and dark themes:
+
+  Cinnamon 100 to 1600
+
+  ## Design Motivation
+
+  This is the last new color that is a part of the new color set needed from Premiere Pro. The additional color will also help when creating new data vis color palettes for Spectrum 2.
+
+  ## Token Diff
+
+  _Tokens added (17):_
+
+  - `cinnamon-100`
+  - `cinnamon-200`
+  - `cinnamon-300`
+  - `cinnamon-400`
+  - `cinnamon-500`
+  - `cinnamon-600`
+  - `cinnamon-700`
+  - `cinnamon-800`
+  - `cinnamon-900`
+  - `cinnamon-1000`
+  - `cinnamon-1100`
+  - `cinnamon-1200`
+  - `cinnamon-1300`
+  - `cinnamon-1400`
+  - `cinnamon-1500`
+  - `cinnamon-1600`
+
+- 91d7e95: Fixed bug in the light theme value for notice-background-color-default, from notice-color-800 to notice-color-600
+
+  ## Design Motivation
+
+  While updating the badge component in Figma, we noticed a bug where notice-background-color-default in S2 was entered incorrectly for light theme, and should instead match the value for S1
+
+  ## Token Diff
+
+  _Token values updated (1):_
+
+  - `notice-background-color-default`: `light`: `notice-color-800` -> `notice-color-600`
+
+## 13.0.0-beta.5
+
+### Major Changes
+
+- 0af2674: feat: new color values for spectrum2
+
+  ## Design Motivation
+
+  This update addresses several improvements:
+
+  fuchsia, seafoam: all values shifted to make room for new colors, pink and turquoise
+  all other colors: certain values were updated to address accessibility contrast requirements against Spectrum 2 background layer colors
+
+  ## Token Diff
+
+  <details><summary><strong>Token values updated (246):</strong></summary>
+
+  - `accent-background-color-default`
+  - `accent-background-color-down`
+  - `accent-background-color-hover`
+  - `accent-background-color-key-focus`
+  - `accent-color-1000`
+  - `accent-color-200`
+  - `accent-color-300`
+  - `accent-color-400`
+  - `accent-color-500`
+  - `accent-color-600`
+  - `accent-color-700`
+  - `accent-color-800`
+  - `accent-color-900`
+  - `accent-content-color-default`
+  - `accent-content-color-down`
+  - `accent-content-color-hover`
+  - `accent-content-color-key-focus`
+  - `accent-content-color-selected`
+  - `accent-visual-color`
+  - `blue-1000`
+  - `blue-200`
+  - `blue-300`
+  - `blue-400`
+  - `blue-500`
+  - `blue-600`
+  - `blue-700`
+  - `blue-800`
+  - `blue-900`
+  - `blue-background-color-default`
+  - `blue-visual-color`
+  - `celery-1000`
+  - `celery-200`
+  - `celery-300`
+  - `celery-400`
+  - `celery-500`
+  - `celery-600`
+  - `celery-700`
+  - `celery-800`
+  - `celery-900`
+  - `celery-background-color-default`
+  - `celery-visual-color`
+  - `chartreuse-1000`
+  - `chartreuse-200`
+  - `chartreuse-300`
+  - `chartreuse-400`
+  - `chartreuse-500`
+  - `chartreuse-600`
+  - `chartreuse-700`
+  - `chartreuse-800`
+  - `chartreuse-900`
+  - `chartreuse-background-color-default`
+  - `chartreuse-visual-color`
+  - `cyan-1000`
+  - `cyan-300`
+  - `cyan-400`
+  - `cyan-500`
+  - `cyan-600`
+  - `cyan-700`
+  - `cyan-800`
+  - `cyan-900`
+  - `cyan-background-color-default`
+  - `cyan-visual-color`
+  - `drop-zone-background-color`
+  - `focus-indicator-color`
+  - `fuchsia-100`
+  - `fuchsia-1000`
+  - `fuchsia-1100`
+  - `fuchsia-1200`
+  - `fuchsia-1300`
+  - `fuchsia-1400`
+  - `fuchsia-1500`
+  - `fuchsia-1600`
+  - `fuchsia-200`
+  - `fuchsia-300`
+  - `fuchsia-400`
+  - `fuchsia-500`
+  - `fuchsia-600`
+  - `fuchsia-700`
+  - `fuchsia-800`
+  - `fuchsia-900`
+  - `fuchsia-background-color-default`
+  - `fuchsia-visual-color`
+  - `green-100`
+  - `green-1000`
+  - `green-200`
+  - `green-300`
+  - `green-400`
+  - `green-500`
+  - `green-600`
+  - `green-700`
+  - `green-800`
+  - `green-900`
+  - `green-background-color-default`
+  - `green-visual-color`
+  - `icon-color-blue-primary-default`
+  - `icon-color-green-primary-default`
+  - `icon-color-red-primary-default`
+  - `icon-color-yellow-primary-default`
+  - `indigo-1000`
+  - `indigo-300`
+  - `indigo-400`
+  - `indigo-500`
+  - `indigo-600`
+  - `indigo-700`
+  - `indigo-800`
+  - `indigo-900`
+  - `indigo-background-color-default`
+  - `indigo-visual-color`
+  - `informative-background-color-default`
+  - `informative-background-color-down`
+  - `informative-background-color-hover`
+  - `informative-background-color-key-focus`
+  - `informative-color-1000`
+  - `informative-color-200`
+  - `informative-color-300`
+  - `informative-color-400`
+  - `informative-color-500`
+  - `informative-color-600`
+  - `informative-color-700`
+  - `informative-color-800`
+  - `informative-color-900`
+  - `informative-visual-color`
+  - `magenta-100`
+  - `magenta-1000`
+  - `magenta-1100`
+  - `magenta-1200`
+  - `magenta-1300`
+  - `magenta-1400`
+  - `magenta-200`
+  - `magenta-300`
+  - `magenta-400`
+  - `magenta-500`
+  - `magenta-600`
+  - `magenta-700`
+  - `magenta-800`
+  - `magenta-900`
+  - `magenta-background-color-default`
+  - `magenta-visual-color`
+  - `negative-background-color-default`
+  - `negative-background-color-down`
+  - `negative-background-color-hover`
+  - `negative-background-color-key-focus`
+  - `negative-border-color-default`
+  - `negative-border-color-focus`
+  - `negative-border-color-hover`
+  - `negative-border-color-key-focus`
+  - `negative-color-1000`
+  - `negative-color-200`
+  - `negative-color-300`
+  - `negative-color-400`
+  - `negative-color-500`
+  - `negative-color-600`
+  - `negative-color-700`
+  - `negative-color-800`
+  - `negative-color-900`
+  - `negative-content-color-default`
+  - `negative-content-color-down`
+  - `negative-content-color-hover`
+  - `negative-content-color-key-focus`
+  - `negative-visual-color`
+  - `notice-background-color-default`
+  - `notice-color-1000`
+  - `notice-color-200`
+  - `notice-color-400`
+  - `notice-color-500`
+  - `notice-color-600`
+  - `notice-color-700`
+  - `notice-color-800`
+  - `notice-color-900`
+  - `notice-visual-color`
+  - `orange-1000`
+  - `orange-200`
+  - `orange-400`
+  - `orange-500`
+  - `orange-600`
+  - `orange-700`
+  - `orange-800`
+  - `orange-900`
+  - `orange-background-color-default`
+  - `orange-visual-color`
+  - `positive-background-color-default`
+  - `positive-background-color-down`
+  - `positive-background-color-hover`
+  - `positive-background-color-key-focus`
+  - `positive-color-100`
+  - `positive-color-1000`
+  - `positive-color-200`
+  - `positive-color-300`
+  - `positive-color-400`
+  - `positive-color-500`
+  - `positive-color-600`
+  - `positive-color-700`
+  - `positive-color-800`
+  - `positive-color-900`
+  - `positive-visual-color`
+  - `purple-1000`
+  - `purple-200`
+  - `purple-300`
+  - `purple-400`
+  - `purple-500`
+  - `purple-600`
+  - `purple-700`
+  - `purple-800`
+  - `purple-900`
+  - `purple-background-color-default`
+  - `purple-visual-color`
+  - `red-1000`
+  - `red-200`
+  - `red-300`
+  - `red-400`
+  - `red-500`
+  - `red-600`
+  - `red-700`
+  - `red-800`
+  - `red-900`
+  - `red-background-color-default`
+  - `red-visual-color`
+  - `seafoam-100`
+  - `seafoam-1000`
+  - `seafoam-1100`
+  - `seafoam-1200`
+  - `seafoam-1300`
+  - `seafoam-1400`
+  - `seafoam-1500`
+  - `seafoam-1600`
+  - `seafoam-200`
+  - `seafoam-300`
+  - `seafoam-400`
+  - `seafoam-500`
+  - `seafoam-600`
+  - `seafoam-700`
+  - `seafoam-800`
+  - `seafoam-900`
+  - `seafoam-background-color-default`
+  - `seafoam-visual-color`
+  - `table-selected-row-background-color`
+  - `yellow-1000`
+  - `yellow-300`
+  - `yellow-400`
+  - `yellow-500`
+  - `yellow-600`
+  - `yellow-700`
+  - `yellow-800`
+  - `yellow-900`
+  - `yellow-background-color-default`
+  - `yellow-visual-color`
+
+  </details>
+
+### Minor Changes
+
+- 7b5ec24: feat: add new color tokens
+
+  ## Design Motivation
+
+  Added new colors due to needs from Premiere Pro. The additional colors will also help when creating new data vis color palettes for Spectrum 2.
+
+  ## Token Diff
+
+  <details><summary><strong>Tokens added (64):</strong></summary>
+
+  - `brown-100`
+  - `brown-1000`
+  - `brown-1100`
+  - `brown-1200`
+  - `brown-1300`
+  - `brown-1400`
+  - `brown-1500`
+  - `brown-1600`
+  - `brown-200`
+  - `brown-300`
+  - `brown-400`
+  - `brown-500`
+  - `brown-600`
+  - `brown-700`
+  - `brown-800`
+  - `brown-900`
+  - `pink-100`
+  - `pink-1000`
+  - `pink-1100`
+  - `pink-1200`
+  - `pink-1300`
+  - `pink-1400`
+  - `pink-1500`
+  - `pink-1600`
+  - `pink-200`
+  - `pink-300`
+  - `pink-400`
+  - `pink-500`
+  - `pink-600`
+  - `pink-700`
+  - `pink-800`
+  - `pink-900`
+  - `silver-100`
+  - `silver-1000`
+  - `silver-1100`
+  - `silver-1200`
+  - `silver-1300`
+  - `silver-1400`
+  - `silver-1500`
+  - `silver-1600`
+  - `silver-200`
+  - `silver-300`
+  - `silver-400`
+  - `silver-500`
+  - `silver-600`
+  - `silver-700`
+  - `silver-800`
+  - `silver-900`
+  - `turquoise-100`
+  - `turquoise-1000`
+  - `turquoise-1100`
+  - `turquoise-1200`
+  - `turquoise-1300`
+  - `turquoise-1400`
+  - `turquoise-1500`
+  - `turquoise-1600`
+  - `turquoise-200`
+  - `turquoise-300`
+  - `turquoise-400`
+  - `turquoise-500`
+  - `turquoise-600`
+  - `turquoise-700`
+  - `turquoise-800`
+  - `turquoise-900`
+
+  </details>
+
+## 13.0.0-beta.4
+
+### Major Changes
+
+- a08dced: A handful of values transitioned from being defined per-set to being constants; set values are deprecated and root values are defined.
+
+  ## Token Diff
+
+  _Token values updated (5):_
+
+  - `neutral-background-color-default`: changed from a color-set to a single value of a reference of `gray-800`
+  - `neutral-background-color-down`: changed from a color-set to a single value of a reference of `gray-900`
+  - `neutral-background-color-hover`: changed from a color-set to a single value of a reference of `gray-900`
+  - `neutral-background-color-key-focus`: changed from a color-set to a single value of a reference of `gray-900`
+  - `notice-background-color-default`: changed from a color-set to a single value of a reference of `notice-color-800`
+
+### Patch Changes
+
+- c0a10b4: fix: rgb used instead of rgba for a couple tokens
+
+## 13.0.0-beta.3
+
+### Patch Changes
+
+- a546ef7: Returned some tokens that were removed by accident in the previous merging.
+
+  ## Token Diff
+
+  _Tokens added (51):_
+
+  - `checkbox-control-size-extra-large`
+  - `checkbox-control-size-large`
+  - `checkbox-control-size-medium`
+  - `checkbox-control-size-small`
+  - `checkbox-top-to-control-extra-large`
+  - `checkbox-top-to-control-large`
+  - `checkbox-top-to-control-medium`
+  - `checkbox-top-to-control-small`
+  - `color-area-border-rounding`
+  - `corner-radius-100`
+  - `corner-radius-200`
+  - `corner-radius-75`
+  - `drop-shadow-blur`
+  - `drop-shadow-x`
+  - `drop-shadow-y`
+  - `radio-button-control-size-extra-large`
+  - `radio-button-control-size-large`
+  - `radio-button-control-size-medium`
+  - `radio-button-control-size-small`
+  - `radio-button-top-to-control-extra-large`
+  - `radio-button-top-to-control-large`
+  - `radio-button-top-to-control-medium`
+  - `radio-button-top-to-control-small`
+  - `slider-bottom-to-handle-extra-large`
+  - `slider-bottom-to-handle-large`
+  - `slider-bottom-to-handle-medium`
+  - `slider-bottom-to-handle-small`
+  - `slider-control-height-extra-large`
+  - `slider-control-height-large`
+  - `slider-control-height-medium`
+  - `slider-control-height-small`
+  - `slider-handle-border-width-down-extra-large`
+  - `slider-handle-border-width-down-large`
+  - `slider-handle-border-width-down-medium`
+  - `slider-handle-border-width-down-small`
+  - `slider-handle-size-extra-large`
+  - `slider-handle-size-large`
+  - `slider-handle-size-medium`
+  - `slider-handle-size-small`
+  - `switch-control-height-extra-large`
+  - `switch-control-height-large`
+  - `switch-control-height-medium`
+  - `switch-control-height-small`
+  - `switch-control-width-extra-large`
+  - `switch-control-width-large`
+  - `switch-control-width-medium`
+  - `switch-control-width-small`
+  - `switch-top-to-control-extra-large`
+  - `switch-top-to-control-large`
+  - `switch-top-to-control-medium`
+  - `switch-top-to-control-small`
+
+## 13.0.0-beta.2
+
+### Major Changes
+
+- ee15851: Updated color tokens to use S2 values
+
+  ## Design Motivation
+
+  The S2 microsite documentation discusses changes to the [grays](https://s2.spectrum.corp.adobe.com/page/grays/) and [colors](https://s2.spectrum.corp.adobe.com/page/colors/).
+
+  ## Token Diff
+
+  <details><summary><strong>Tokens added (46):</strong></summary>
+
+  - `accent-color-1500`
+  - `accent-color-1600`
+  - `blue-1500`
+  - `blue-1600`
+  - `celery-1500`
+  - `celery-1600`
+  - `chartreuse-1500`
+  - `chartreuse-1600`
+  - `cyan-1500`
+  - `cyan-1600`
+  - `fuchsia-1500`
+  - `fuchsia-1600`
+  - `gray-1000`
+  - `gray-25`
+  - `green-1500`
+  - `green-1600`
+  - `indigo-1500`
+  - `indigo-1600`
+  - `informative-color-1500`
+  - `informative-color-1600`
+  - `magenta-1500`
+  - `magenta-1600`
+  - `negative-color-1500`
+  - `negative-color-1600`
+  - `notice-color-1500`
+  - `notice-color-1600`
+  - `orange-1500`
+  - `orange-1600`
+  - `positive-color-1500`
+  - `positive-color-1600`
+  - `purple-1500`
+  - `purple-1600`
+  - `red-1500`
+  - `red-1600`
+  - `seafoam-1500`
+  - `seafoam-1600`
+  - `transparent-black-1000`
+  - `transparent-black-25`
+  - `transparent-black-50`
+  - `transparent-black-75`
+  - `transparent-white-1000`
+  - `transparent-white-25`
+  - `transparent-white-50`
+  - `transparent-white-75`
+  - `yellow-1500`
+  - `yellow-1600`
+
+  </details>
+
+  <details><summary><strong>Token values updated (408):</strong></summary>
+
+  - `accent-background-color-default`
+  - `accent-background-color-down`
+  - `accent-background-color-hover`
+  - `accent-background-color-key-focus`
+  - `accent-color-100`
+  - `accent-color-1000`
+  - `accent-color-1100`
+  - `accent-color-1200`
+  - `accent-color-1300`
+  - `accent-color-1400`
+  - `accent-color-200`
+  - `accent-color-300`
+  - `accent-color-400`
+  - `accent-color-500`
+  - `accent-color-600`
+  - `accent-color-700`
+  - `accent-color-800`
+  - `accent-color-900`
+  - `accent-content-color-default`
+  - `accent-content-color-down`
+  - `accent-content-color-hover`
+  - `accent-content-color-key-focus`
+  - `accent-content-color-selected`
+  - `accent-visual-color`
+  - `background-base-color`
+  - `background-layer-1-color`
+  - `background-layer-2-color`
+  - `blue-100`
+  - `blue-1000`
+  - `blue-1100`
+  - `blue-1200`
+  - `blue-1300`
+  - `blue-1400`
+  - `blue-200`
+  - `blue-300`
+  - `blue-400`
+  - `blue-500`
+  - `blue-600`
+  - `blue-700`
+  - `blue-800`
+  - `blue-900`
+  - `blue-background-color-default`
+  - `blue-visual-color`
+  - `body-color`
+  - `card-selection-background-color`
+  - `celery-100`
+  - `celery-1000`
+  - `celery-1100`
+  - `celery-1200`
+  - `celery-1300`
+  - `celery-1400`
+  - `celery-200`
+  - `celery-300`
+  - `celery-400`
+  - `celery-500`
+  - `celery-600`
+  - `celery-700`
+  - `celery-800`
+  - `celery-900`
+  - `celery-background-color-default`
+  - `celery-visual-color`
+  - `chartreuse-100`
+  - `chartreuse-1000`
+  - `chartreuse-1100`
+  - `chartreuse-1200`
+  - `chartreuse-1300`
+  - `chartreuse-1400`
+  - `chartreuse-200`
+  - `chartreuse-300`
+  - `chartreuse-400`
+  - `chartreuse-500`
+  - `chartreuse-600`
+  - `chartreuse-700`
+  - `chartreuse-800`
+  - `chartreuse-900`
+  - `chartreuse-background-color-default`
+  - `chartreuse-visual-color`
+  - `coach-mark-pagination-color`
+  - `code-color`
+  - `color-area-border-color`
+  - `color-loupe-drop-shadow-color`
+  - `color-loupe-inner-border`
+  - `color-slider-border-color`
+  - `cyan-100`
+  - `cyan-1000`
+  - `cyan-1100`
+  - `cyan-1200`
+  - `cyan-1300`
+  - `cyan-1400`
+  - `cyan-200`
+  - `cyan-300`
+  - `cyan-400`
+  - `cyan-500`
+  - `cyan-600`
+  - `cyan-700`
+  - `cyan-800`
+  - `cyan-900`
+  - `cyan-background-color-default`
+  - `cyan-visual-color`
+  - `detail-color`
+  - `disabled-background-color`
+  - `disabled-border-color`
+  - `disabled-content-color`
+  - `disabled-static-black-background-color`
+  - `disabled-static-black-border-color`
+  - `disabled-static-black-content-color`
+  - `disabled-static-white-background-color`
+  - `disabled-static-white-border-color`
+  - `disabled-static-white-content-color`
+  - `drop-zone-background-color`
+  - `floating-action-button-drop-shadow-color`
+  - `floating-action-button-shadow-color`
+  - `focus-indicator-color`
+  - `fuchsia-100`
+  - `fuchsia-1000`
+  - `fuchsia-1100`
+  - `fuchsia-1200`
+  - `fuchsia-1300`
+  - `fuchsia-1400`
+  - `fuchsia-200`
+  - `fuchsia-300`
+  - `fuchsia-400`
+  - `fuchsia-500`
+  - `fuchsia-600`
+  - `fuchsia-700`
+  - `fuchsia-800`
+  - `fuchsia-900`
+  - `fuchsia-background-color-default`
+  - `fuchsia-visual-color`
+  - `gray-100`
+  - `gray-200`
+  - `gray-300`
+  - `gray-400`
+  - `gray-50`
+  - `gray-500`
+  - `gray-600`
+  - `gray-700`
+  - `gray-75`
+  - `gray-800`
+  - `gray-900`
+  - `gray-background-color-default`
+  - `gray-visual-color`
+  - `green-100`
+  - `green-1000`
+  - `green-1100`
+  - `green-1200`
+  - `green-1300`
+  - `green-1400`
+  - `green-200`
+  - `green-300`
+  - `green-400`
+  - `green-500`
+  - `green-600`
+  - `green-700`
+  - `green-800`
+  - `green-900`
+  - `green-background-color-default`
+  - `green-visual-color`
+  - `heading-color`
+  - `icon-color-blue-primary-default`
+  - `icon-color-green-primary-default`
+  - `icon-color-inverse`
+  - `icon-color-primary-default`
+  - `icon-color-red-primary-default`
+  - `icon-color-yellow-primary-default`
+  - `indigo-100`
+  - `indigo-1000`
+  - `indigo-1100`
+  - `indigo-1200`
+  - `indigo-1300`
+  - `indigo-1400`
+  - `indigo-200`
+  - `indigo-300`
+  - `indigo-400`
+  - `indigo-500`
+  - `indigo-600`
+  - `indigo-700`
+  - `indigo-800`
+  - `indigo-900`
+  - `indigo-background-color-default`
+  - `indigo-visual-color`
+  - `informative-background-color-default`
+  - `informative-background-color-down`
+  - `informative-background-color-hover`
+  - `informative-background-color-key-focus`
+  - `informative-color-100`
+  - `informative-color-1000`
+  - `informative-color-1100`
+  - `informative-color-1200`
+  - `informative-color-1300`
+  - `informative-color-1400`
+  - `informative-color-200`
+  - `informative-color-300`
+  - `informative-color-400`
+  - `informative-color-500`
+  - `informative-color-600`
+  - `informative-color-700`
+  - `informative-color-800`
+  - `informative-color-900`
+  - `informative-visual-color`
+  - `magenta-100`
+  - `magenta-1000`
+  - `magenta-1100`
+  - `magenta-1200`
+  - `magenta-1300`
+  - `magenta-1400`
+  - `magenta-200`
+  - `magenta-300`
+  - `magenta-400`
+  - `magenta-500`
+  - `magenta-600`
+  - `magenta-700`
+  - `magenta-800`
+  - `magenta-900`
+  - `magenta-background-color-default`
+  - `magenta-visual-color`
+  - `negative-background-color-default`
+  - `negative-background-color-down`
+  - `negative-background-color-hover`
+  - `negative-background-color-key-focus`
+  - `negative-border-color-default`
+  - `negative-border-color-down`
+  - `negative-border-color-focus`
+  - `negative-border-color-focus-hover`
+  - `negative-border-color-hover`
+  - `negative-border-color-key-focus`
+  - `negative-color-100`
+  - `negative-color-1000`
+  - `negative-color-1100`
+  - `negative-color-1200`
+  - `negative-color-1300`
+  - `negative-color-1400`
+  - `negative-color-200`
+  - `negative-color-300`
+  - `negative-color-400`
+  - `negative-color-500`
+  - `negative-color-600`
+  - `negative-color-700`
+  - `negative-color-800`
+  - `negative-color-900`
+  - `negative-content-color-default`
+  - `negative-content-color-down`
+  - `negative-content-color-hover`
+  - `negative-content-color-key-focus`
+  - `negative-visual-color`
+  - `neutral-background-color-default`
+  - `neutral-background-color-down`
+  - `neutral-background-color-hover`
+  - `neutral-background-color-key-focus`
+  - `neutral-background-color-selected-default`
+  - `neutral-background-color-selected-down`
+  - `neutral-background-color-selected-hover`
+  - `neutral-background-color-selected-key-focus`
+  - `neutral-content-color-default`
+  - `neutral-content-color-down`
+  - `neutral-content-color-focus`
+  - `neutral-content-color-focus-hover`
+  - `neutral-content-color-hover`
+  - `neutral-content-color-key-focus`
+  - `neutral-subdued-background-color-default`
+  - `neutral-subdued-background-color-down`
+  - `neutral-subdued-background-color-hover`
+  - `neutral-subdued-background-color-key-focus`
+  - `neutral-subdued-content-color-default`
+  - `neutral-subdued-content-color-down`
+  - `neutral-subdued-content-color-hover`
+  - `neutral-subdued-content-color-key-focus`
+  - `neutral-subdued-content-color-selected`
+  - `neutral-visual-color`
+  - `notice-background-color-default`
+  - `notice-color-100`
+  - `notice-color-1000`
+  - `notice-color-1100`
+  - `notice-color-1200`
+  - `notice-color-1300`
+  - `notice-color-1400`
+  - `notice-color-200`
+  - `notice-color-300`
+  - `notice-color-400`
+  - `notice-color-500`
+  - `notice-color-600`
+  - `notice-color-700`
+  - `notice-color-800`
+  - `notice-color-900`
+  - `notice-visual-color`
+  - `opacity-checkerboard-square-dark`
+  - `orange-100`
+  - `orange-1000`
+  - `orange-1100`
+  - `orange-1200`
+  - `orange-1300`
+  - `orange-1400`
+  - `orange-200`
+  - `orange-300`
+  - `orange-400`
+  - `orange-500`
+  - `orange-600`
+  - `orange-700`
+  - `orange-800`
+  - `orange-900`
+  - `orange-background-color-default`
+  - `orange-visual-color`
+  - `positive-background-color-default`
+  - `positive-background-color-down`
+  - `positive-background-color-hover`
+  - `positive-background-color-key-focus`
+  - `positive-color-100`
+  - `positive-color-1000`
+  - `positive-color-1100`
+  - `positive-color-1200`
+  - `positive-color-1300`
+  - `positive-color-1400`
+  - `positive-color-200`
+  - `positive-color-300`
+  - `positive-color-400`
+  - `positive-color-500`
+  - `positive-color-600`
+  - `positive-color-700`
+  - `positive-color-800`
+  - `positive-color-900`
+  - `positive-visual-color`
+  - `purple-100`
+  - `purple-1000`
+  - `purple-1100`
+  - `purple-1200`
+  - `purple-1300`
+  - `purple-1400`
+  - `purple-200`
+  - `purple-300`
+  - `purple-400`
+  - `purple-500`
+  - `purple-600`
+  - `purple-700`
+  - `purple-800`
+  - `purple-900`
+  - `purple-background-color-default`
+  - `purple-visual-color`
+  - `red-100`
+  - `red-1000`
+  - `red-1100`
+  - `red-1200`
+  - `red-1300`
+  - `red-1400`
+  - `red-200`
+  - `red-300`
+  - `red-400`
+  - `red-500`
+  - `red-600`
+  - `red-700`
+  - `red-800`
+  - `red-900`
+  - `red-background-color-default`
+  - `red-visual-color`
+  - `seafoam-100`
+  - `seafoam-1000`
+  - `seafoam-1100`
+  - `seafoam-1200`
+  - `seafoam-1300`
+  - `seafoam-1400`
+  - `seafoam-200`
+  - `seafoam-300`
+  - `seafoam-400`
+  - `seafoam-500`
+  - `seafoam-600`
+  - `seafoam-700`
+  - `seafoam-800`
+  - `seafoam-900`
+  - `seafoam-background-color-default`
+  - `seafoam-visual-color`
+  - `swatch-border-color`
+  - `table-row-hover-color`
+  - `table-selected-row-background-color`
+  - `table-selected-row-background-color-non-emphasized`
+  - `thumbnail-border-color`
+  - `transparent-black-100`
+  - `transparent-black-200`
+  - `transparent-black-300`
+  - `transparent-black-400`
+  - `transparent-black-500`
+  - `transparent-black-600`
+  - `transparent-black-700`
+  - `transparent-black-800`
+  - `transparent-black-900`
+  - `transparent-white-100`
+  - `transparent-white-200`
+  - `transparent-white-300`
+  - `transparent-white-400`
+  - `transparent-white-500`
+  - `transparent-white-600`
+  - `transparent-white-700`
+  - `transparent-white-800`
+  - `transparent-white-900`
+  - `yellow-100`
+  - `yellow-1000`
+  - `yellow-1100`
+  - `yellow-1200`
+  - `yellow-1300`
+  - `yellow-1400`
+  - `yellow-200`
+  - `yellow-300`
+  - `yellow-400`
+  - `yellow-500`
+  - `yellow-600`
+  - `yellow-700`
+  - `yellow-800`
+  - `yellow-900`
+  - `yellow-background-color-default`
+  - `yellow-visual-color`
+
+  </details>
+
 ## 13.0.0-beta.1
 
 ### Major Changes