@adobe/spectrum-design-data 3.2.2 → 3.3.0-beta.0

package/guidelines/manifest.json

@@ -1,5 +1,13 @@
 {
   "guidelines": [
+    {
+      "slug": "ai-resource-guide",
+      "title": "AI resource guide",
+      "category": "support",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/support/ai-resource-guide",
+      "file": "guidelines/ai-resource-guide.json"
+    },
     {
       "slug": "app-frame-content-area",
       "title": "App frame content area (browsing context)",
@@ -29,7 +37,7 @@
       "title": "App frame",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/app-frame-overview/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/app-frame/overview",
       "file": "guidelines/app-frame-overview.json"
     },
     {
@@ -40,12 +48,20 @@
       "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/app-frame-side-navigation/",
       "file": "guidelines/app-frame-side-navigation.json"
     },
+    {
+      "slug": "applying-the-type-system",
+      "title": "Applying the type system",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/typography/applying-the-type-system",
+      "file": "guidelines/applying-the-type-system.json"
+    },
     {
       "slug": "attention-hierarchy",
       "title": "Attention hierarchy",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/attention-hierarchy/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/attention-hierarchy",
       "file": "guidelines/attention-hierarchy.json"
     },
     {
@@ -53,25 +69,65 @@
       "title": "Background layers",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/background-layers/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/color/background-layers",
       "file": "guidelines/background-layers.json"
     },
+    {
+      "slug": "bi-directionality",
+      "title": "Bi-directionality",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/inclusivity/bi-directionality",
+      "file": "guidelines/bi-directionality.json"
+    },
+    {
+      "slug": "border-width",
+      "title": "Border width",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/styles/object-styles/border-width",
+      "file": "guidelines/border-width.json"
+    },
     {
       "slug": "brand",
       "title": "Brand",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/brand/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/brand",
       "file": "guidelines/brand.json"
     },
+    {
+      "slug": "cognitive",
+      "title": "Cognitive",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/inclusivity/cognitive",
+      "file": "guidelines/cognitive.json"
+    },
     {
       "slug": "colors",
       "title": "Colors",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/colors/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/color/colors",
       "file": "guidelines/colors.json"
     },
+    {
+      "slug": "component-spacing",
+      "title": "Component spacing",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/layout-and-structure/spacing/component-spacing",
+      "file": "guidelines/component-spacing.json"
+    },
+    {
+      "slug": "contact-us",
+      "title": "Contact us",
+      "category": "support",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/support/contact-us",
+      "file": "guidelines/contact-us.json"
+    },
     {
       "slug": "containers",
       "title": "Containers",
@@ -80,20 +136,52 @@
       "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/containers/",
       "file": "guidelines/containers.json"
     },
+    {
+      "slug": "content-area-browsing-context",
+      "title": "Browsing context: Content area",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/app-frame/content-area-browsing-context",
+      "file": "guidelines/content-area-browsing-context.json"
+    },
+    {
+      "slug": "creating-bluelines-browsing-context",
+      "title": "Creating bluelines",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/app-frame/creating-bluelines-browsing-context",
+      "file": "guidelines/creating-bluelines-browsing-context.json"
+    },
+    {
+      "slug": "design-tokens",
+      "title": "Design tokens",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/design-data/design-tokens",
+      "file": "guidelines/design-tokens.json"
+    },
     {
       "slug": "developer-overview",
       "title": "Developer overview",
       "category": "developing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/developer-overview/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/support/developer-overview",
       "file": "guidelines/developer-overview.json"
     },
+    {
+      "slug": "drop-shadow",
+      "title": "Drop shadow",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/styles/object-styles/drop-shadow",
+      "file": "guidelines/drop-shadow.json"
+    },
     {
       "slug": "faqs",
       "title": "FAQs",
       "category": "support",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/faqs/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/support/faqs",
       "file": "guidelines/faqs.json"
     },
     {
@@ -101,25 +189,49 @@
       "title": "Fonts",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/fonts/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/typography/fonts",
       "file": "guidelines/fonts.json"
     },
+    {
+      "slug": "grammar-and-mechanics",
+      "title": "Grammar and mechanics",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/grammar-and-mechanics",
+      "file": "guidelines/grammar-and-mechanics.json"
+    },
     {
       "slug": "grays",
       "title": "Grays",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/grays/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/color/grays",
       "file": "guidelines/grays.json"
     },
+    {
+      "slug": "header-browsing-context",
+      "title": "Browsing context: Header",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/app-frame/header-browsing-context",
+      "file": "guidelines/header-browsing-context.json"
+    },
     {
       "slug": "icon-fundamentals",
       "title": "Icon fundamentals",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/icon-fundamentals/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/icons-and-illustrations/icon-fundamentals",
       "file": "guidelines/icon-fundamentals.json"
     },
+    {
+      "slug": "illustration",
+      "title": "Illustration",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/visual-language/illustration",
+      "file": "guidelines/illustration.json"
+    },
     {
       "slug": "illustrations",
       "title": "Illustrations",
@@ -128,6 +240,38 @@
       "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/illustrations/",
       "file": "guidelines/illustrations.json"
     },
+    {
+      "slug": "in-product-word-list",
+      "title": "In-product word list",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/in-product-word-list",
+      "file": "guidelines/in-product-word-list.json"
+    },
+    {
+      "slug": "inclusive-design",
+      "title": "Inclusive design",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/inclusivity/inclusive-design",
+      "file": "guidelines/inclusive-design.json"
+    },
+    {
+      "slug": "inclusive-ux-writing",
+      "title": "Inclusive UX writing",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/language-and-inclusivity/inclusive-ux-writing",
+      "file": "guidelines/inclusive-ux-writing.json"
+    },
+    {
+      "slug": "internationalization",
+      "title": "Internationalization",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/inclusivity/internationalization",
+      "file": "guidelines/internationalization.json"
+    },
     {
       "slug": "introduction",
       "title": "Introduction",
@@ -136,12 +280,28 @@
       "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/introduction/",
       "file": "guidelines/introduction.json"
     },
+    {
+      "slug": "layout-and-structure-containers",
+      "title": "Containers",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/layout-and-structure/containers",
+      "file": "guidelines/layout-and-structure-containers.json"
+    },
+    {
+      "slug": "layout-spacing",
+      "title": "Layout spacing",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/layout-and-structure/spacing/layout-spacing",
+      "file": "guidelines/layout-spacing.json"
+    },
     {
       "slug": "motion",
       "title": "Motion",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/motion/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/behavior/motion",
       "file": "guidelines/motion.json"
     },
     {
@@ -152,6 +312,14 @@
       "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/object-styles/",
       "file": "guidelines/object-styles.json"
     },
+    {
+      "slug": "object-styles-overview",
+      "title": "Object styles",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/styles/object-styles/overview",
+      "file": "guidelines/object-styles-overview.json"
+    },
     {
       "slug": "principles",
       "title": "Principles",
@@ -165,9 +333,25 @@
       "title": "Resources",
       "category": "support",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/resources/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/support/resources",
       "file": "guidelines/resources.json"
     },
+    {
+      "slug": "rounding",
+      "title": "Rounding",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/styles/object-styles/rounding",
+      "file": "guidelines/rounding.json"
+    },
+    {
+      "slug": "side-navigation-browsing-context",
+      "title": "Browsing context: Side nav",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/app-frame/side-navigation-browsing-context",
+      "file": "guidelines/side-navigation-browsing-context.json"
+    },
     {
       "slug": "spacing",
       "title": "Spacing",
@@ -176,12 +360,20 @@
       "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/spacing/",
       "file": "guidelines/spacing.json"
     },
+    {
+      "slug": "spacing-overview",
+      "title": "Spacing overview",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/layout-and-structure/spacing/spacing-overview",
+      "file": "guidelines/spacing-overview.json"
+    },
     {
       "slug": "states",
       "title": "States",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/states/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/behavior/states",
       "file": "guidelines/states.json"
     },
     {
@@ -192,13 +384,85 @@
       "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/typography-fundamentals/",
       "file": "guidelines/typography-fundamentals.json"
     },
+    {
+      "slug": "typography-overview",
+      "title": "Typography",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/typography/overview",
+      "file": "guidelines/typography-overview.json"
+    },
+    {
+      "slug": "typography-system",
+      "title": "Typography system",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/typography/typography-system",
+      "file": "guidelines/typography-system.json"
+    },
     {
       "slug": "using-icons",
       "title": "Using icons",
       "category": "designing",
       "status": "published",
-      "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/using-icons/",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/icons-and-illustrations/using-icons",
       "file": "guidelines/using-icons.json"
+    },
+    {
+      "slug": "visual-language-containers",
+      "title": "Containers",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/visual-language/containers",
+      "file": "guidelines/visual-language-containers.json"
+    },
+    {
+      "slug": "voice-and-tone",
+      "title": "Voice and tone",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/voice-and-tone",
+      "file": "guidelines/voice-and-tone.json"
+    },
+    {
+      "slug": "writing-about-people",
+      "title": "Writing about people",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/language-and-inclusivity/writing-about-people",
+      "file": "guidelines/writing-about-people.json"
+    },
+    {
+      "slug": "writing-for-errors",
+      "title": "Writing for errors",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/writing-for-errors",
+      "file": "guidelines/writing-for-errors.json"
+    },
+    {
+      "slug": "writing-for-onboarding",
+      "title": "Writing for onboarding",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/writing-for-onboarding",
+      "file": "guidelines/writing-for-onboarding.json"
+    },
+    {
+      "slug": "writing-for-readability",
+      "title": "Writing for readability",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/language-and-inclusivity/writing-for-readability",
+      "file": "guidelines/writing-for-readability.json"
+    },
+    {
+      "slug": "writing-with-visuals",
+      "title": "Writing with visuals",
+      "category": "designing",
+      "status": "published",
+      "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/content/language-and-inclusivity/writing-with-visuals",
+      "file": "guidelines/writing-with-visuals.json"
     }
   ]
 }

package/guidelines/motion.json

@@ -7,35 +7,36 @@
   "documentBlocks": [
     {
       "type": "purpose",
-      "content": "Spectrum 2 builds on top of the [existing motion guidelines for the design system](https://spectrum.corp.adobe.com/page/motion/): that motion is always purposeful, intuitive, and seamless. With this update, we also use motion to draw attention to areas where we want to add personality. No matter what, the usage of motion should be adding meaning to an experience. And, motion over large surface areas needs to support browser and system settings for reduced motion.\n\nMotion is also an important part of brand expression. Just like tone in language, tone in motion can range from formal and direct to lighthearted and subtle.\n\nMotion in Spectrum 2 is categorized into the areas of **directional** motion, **interaction** motion, and **wayfinding** motion. Wayfinding motion is still in development."
+      "content": "Spectrum 2 builds on top of the Spectrum 1 motion guidelines for the design system: that motion is always purposeful, intuitive, and seamless. With this update, we also use motion to draw attention to areas where we want to add personality. No matter what, the usage of motion should be adding meaning to an experience. And, motion over large surface areas needs to support browser and system settings for reduced motion. Motion is also an important part of brand expression. Just like tone in language, tone in motion can range from formal and direct to lighthearted and subtle. Motion in Spectrum 2 is categorized into the areas of directional motion, interaction motion, and wayfinding motion. Wayfinding motion is still in development."
     },
     {
       "type": "guideline",
-      "content": "Linear motion indicates forward movement and a sentiment of progress. When emphasizing movement to a different section, page, or item (such as a button or link), the destination is readily clear and minimally disruptive.\n\nIf you're creating a custom animation, consider [RTL (right-to-left) languages](https://spectrum.corp.adobe.com/page/bi-directionality/) and also how the meaning of motion might differ depending on cultural context.\n\nProgress bars communicate forward progression. They work well to show determinate (finite) progress.\n\nIn the example of a button, a static arrow icon facing toward the right already indicates forward movement. When linear motion is added to the arrow upon hover, the movement is emphasized. Use this button option with motion sparingly, only on the most important action(s) on a page."
+      "content": "Linear motion indicates forward movement and a sentiment of progress. When emphasizing movement to a different section, page, or item (such as a button or link), the destination is readily clear and minimally disruptive. If you’re creating a custom animation, consider RTL (right-to-left) languages and also how the meaning of motion might differ depending on cultural context. Progress bars communicate forward progression. They work well to show determinate (finite) progress.In this example of a button, a static arrow icon facing toward the right already indicates forward movement. When linear motion is added to the arrow upon hover, the movement is emphasized. Use this button option with motion sparingly, only on the most important action(s) on a page."
     },
     {
       "type": "guideline",
-      "content": "Diagonal motion indicates larger movement, and can be potentially disruptive. This type of motion can be used to emphasize that there's a switch in context happening, like linking out to a different view or destination.\n\nIn the example of a link, a static arrow icon facing the top right already indicates a potentially disruptive action. When diagonal motion is added to the arrow on hover, the meaning of the arrow is emphasized. Use this link option with motion sparingly, and only to communicate that there will be a switch in context."
+      "content": "Diagonal motion indicates larger movement, and can be potentially disruptive. This type of motion can be used to emphasize that there’s a switch in context happening, like linking out to a different view or destination. In this example of a link, a static arrow icon facing the top right already indicates a potentially disruptive action. When diagonal motion is added to the arrow on hover, the meaning of the arrow is emphasized. Use this link option with motion sparingly, and only to communicate that there will be a switch in context."
     },
     {
       "type": "guideline",
-      "content": "Clockwise motion indicates a holding pattern that's repetitive and doesn't have clear forward momentum or progress. This is most often used for loading indicators.\n\nProgress circles have clockwise motion and work well to show indeterminate (infinite) progress."
+      "content": "Clockwise motion indicates a holding pattern that’s repetitive and doesn’t have clear forward momentum or progress. This is most often used for loading indicators. Progress circles have clockwise motion and work well to show indeterminate (infinite) progress."
     },
     {
       "type": "guideline",
-      "content": "Motion shows users feedback that, when interacting with the UI, their actions are registering with a system. It's not the only way to show feedback, but it helps objects to feel more dynamic and responsive. It also can help communicate meaning, or add emphasis that something is happening that requires attention."
-    },
-    {
-      "type": "guideline",
-      "content": "A [microinteraction](https://www.nngroup.com/articles/microinteractions/) is a single action (like a click, tap, or swipe) which triggers a response (like a transition or animation). In Spectrum 2, microinteractions offer moments of personality that are reflective of product branding."
-    },
-    {
-      "type": "guideline",
-      "content": "In this example, the button scales down on the down state, emphasizing that something — the action of selecting — happened."
+      "content": "Motion shows users feedback that, when interacting with the UI, their actions are registering with a system. It’s not the only way to show feedback, but it helps objects to feel more dynamic and responsive. It also can help communicate meaning, or add emphasis that something is happening that requires attention. A microinteraction is a single action (like a click, tap, or swipe) which triggers a response (like a transition or animation). In Spectrum 2, microinteractions offer moments of personality that are reflective of product branding. In this example, the button scales down on the down state, emphasizing that something — the action of selecting — happened."
     }
   ],
-  "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/motion/",
-  "lastUpdated": "2026-02-02",
+  "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/behavior/motion",
+  "lastUpdated": "2026-09-04",
   "status": "published",
-  "tags": ["designing"]
+  "tags": [
+    "Motion",
+    "Directional motion",
+    "Linear motion",
+    "Diagonal motion",
+    "Clockwise motion",
+    "Interaction motion",
+    "Wayfinding motion",
+    "Microinteractions"
+  ]
 }

package/guidelines/object-styles-overview.json

@@ -0,0 +1,17 @@
+{
+  "$schema": "https://opensource.adobe.com/spectrum-design-data/schemas/v0/guideline.schema.json",
+  "$id": "https://opensource.adobe.com/spectrum-design-data/guidelines/object-styles-overview.json",
+  "name": "object-styles-overview",
+  "title": "Object styles",
+  "category": "designing",
+  "documentBlocks": [
+    {
+      "type": "purpose",
+      "content": "Spectrum’s object styles include rounding, border width, and drop shadow. Object styles are combined with color in different ways to communicate specific cues about interactions, adding a layer of meaning to the style of components. For example, different types of inputs all share styles. Search fields, text fields, and combo boxes use object styles to communicate text input. A search field is often more of a global scope, and has full rounding to add emphasis and differentiation from other types of fields. Action buttons, pickers, and in-field buttons share a fill color to indicate selection. Checkboxes, radio buttons, and switches share object styles to indicate binary selection.\n\n### Jump to\n\nRounding Rounding Border width Border width Drop shadow Drop shadow"
+    }
+  ],
+  "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/foundations/styles/object-styles/overview",
+  "lastUpdated": "2026-08-14",
+  "status": "published",
+  "tags": ["Object styles", "Rounding", "Border width", "Drop shadow"]
+}

package/guidelines/resources.json

@@ -8,52 +8,58 @@
     { "type": "purpose", "content": "Resources" },
     {
       "type": "guideline",
-      "content": "The Spectrum 2 Figma libraries are the primary resource for Spectrum 2 components, styles, and variables. These libraries are stable, so you can use the designs in production."
+      "content": "Figma libraries.\n\nThe Spectrum 2 Figma libraries are the primary resource for Spectrum 2 components, styles, and variables. These libraries are stable, so you can use the designs in production. We’re continuing to work on exciting improvements as we expand Spectrum 2. Make sure to regularly review design documentation to keep up-to-date with releases. Familiarize yourself with the changes to components, patterns, styles, variables, and usage guidelines. And most importantly, read the release notes (posted in #spectrum-bulletin ). For any questions, view the FAQs or contact us. To provide feedback on the Spectrum 2 Figma libraries, please visit the #spectrum-design Slack channel and fill out the embedded Slack form. Your input is important and helps us prioritize updates accordingly. Assets, such as icons and illustrations, are published in separate libraries. Reach out to the Icons team to request product-specific icons that are not currently included in a library by submitting a request. For questions specific to the Spectrum 2 Figma icon libraries, post in #figma-icons-libraries on Slack. For general questions about icons, post in #icons. An example of the Spectrum 2 library: the action button page."
     },
     {
       "type": "guideline",
-      "content": "An example of the Spectrum 2 library: the action button page."
+      "content": "Access the Spectrum 2 web libraries:.\n\nS2 / Web with Variables: Formerly known as S2 / Variables, this library is now a single stop for all Spectrum 2 web design data and components, including typography styles, tokens, variables, and up-to-date component statuses S2 / Web (Deprecated): Formerly known as S2 / Web (Desktop scale), contained Spectrum 2 components and typography styles. This library will no longer receive updates but will remain available to use until further notice. S2/Icons, Global: Contains a set of commonly used Spectrum 2 icons S2/Illustrations: Contains a set of Spectrum 2 linear and gradient illustrations"
     },
     {
       "type": "guideline",
-      "content": "This GitHub repository houses Spectrum’s design tokens, which are primarily name-value pairs used to store design decisions and distributed in a way that platforms, implementations, and products can use across design tools and coding languages."
+      "content": "Access the Spectrum 2 iOS library:.\n\nS2/iOS: Contains Spectrum 2 components, typography styles, and variables for iOS If you don’t have access to Figma, you may be able to request view-only access through your product’s design team. Learn more at the Adobe Design Figma Usage: Guidelines and Resources wiki."
     },
     {
       "type": "guideline",
-      "content": "This tool allows you to search for token names or values, filter values by scale and theme, and explore the relationship between Spectrum’s tokens by selecting tokens to see their connections."
+      "content": "Spectrum Tokens repository.\n\nThis GitHub repository houses Spectrum’s design tokens, which are primarily name-value pairs used to store design decisions and distributed in a way that platforms, implementations, and products can use across design tools and coding languages. View Spectrum Tokens on GitHub"
     },
     {
       "type": "guideline",
-      "content": "To support this transition, S2/Color has been removed from the inheritance chain in the Figma libraries. Designers should update their files to replace color styles with color variables. Following the steps in the guide will help ensure your files remain stable and aligned with the Spectrum system moving forward."
+      "content": "Spectrum Token Visualizer tool.\n\nThis tool allows you to search for token names or values, filter values by scale and theme, and explore the relationship between Spectrum’s tokens by selecting tokens to see their connections. View the Spectrum 2 Token Visualizer"
     },
     {
       "type": "guideline",
-      "content": "These changes are for Spectrum 2 libraries. They do not apply to Spectrum 1."
+      "content": "Spectrum Web Components 1.0 uses an approach to Spectrum 2 that applies the design system’s new colors, corner radii, and icons to its components without introducing breaking changes. For more detailed information about this approach, read the initial announcement on the Spectrum wiki. When Spectrum Web Components 2.0 releases, it will include the full Spectrum 2 implementation of its components. The team is currently defining the product strategy, and major announcements about its availability and timeline will be released through Slack channels ( #swc-announcements and #spectrum-web-components ), the Spectrum 2 Wiki, and e-mails to members of the DL GRP-SWC-OFFICEHOURS. Access to this DL is self-serve through Adobe’s IMS portal. View the Spectrum Web Components documentation site"
     },
     {
       "type": "guideline",
-      "content": "To support the new font, we’ve updated our default line-height values and introduced symmetrical vertical padding token values to our design system. The Spectrum 2 typography guide includes details about what’s changing, what’s staying the same, and options for updating design files or implementations."
+      "content": "React Spectrum’s implementation of Spectrum 2 is available for use through the npm package @react-spectrum/s2, and automated migration assistance from React Spectrum V3 to Spectrum 2 is available through the migration wizard. Check the Spectrum 2 in React Spectrum page for more information, including which components are available and how to get started. Releases are announced in the #react-spectrum and #rsp-announcements Slack channels, and developers using the Spectrum 2 library can also request access to a dedicated support channel. View the React Spectrum documentation website"
     },
     {
       "type": "guideline",
-      "content": "These changes are for Spectrum 2 libraries and implementations. They do not apply to Spectrum 1 components."
+      "content": "Spectrum iOS recently released an initial set of components and foundations in its 1.0 release. More information, including the projected components for future releases, are documented on the iOS project’s wiki. Announcements about releases are made in the #spios-announcements and #spectrum-ios Slack channels. For instructions on how to integrate Spectrum iOS into your project, please visit the following wiki page. View spectrum-ios on GitHub View documentation for spectrum-ios View documentation for spectrum-tokens-ios Sign up for access to the Catalog App on TestFlight to try Spectrum iOS on device."
     },
     {
       "type": "guideline",
-      "content": "Spectrum 2 includes two new grays — gray-25 and gray-1000 — plus an update to the rest of the 11 grays. The migration guide goes into more detail about what’s changing and what’s staying the same."
+      "content": "Color variables migration guide.\n\nSpectrum 2 Figma libraries are officially moving from color styles to color variables. Now that Figma variables are fully supported, color styles are being phased out in favor of directly linked variables, from the S2/Variables library. This is now a public library, enabling everyone to connect directly to Spectrum’s source of truth. To support this transition, S2/Color has been removed from the inheritance chain in the Figma libraries. Designers should update their files to replace color styles with color variables. Following the steps in the guide will help ensure your files remain stable and aligned with the Spectrum system moving forward. These changes are for Spectrum 2 libraries. They do not apply to Spectrum 1. View the Spectrum 2 color variables migration guide"
     },
     {
       "type": "guideline",
-      "content": "Creating interfaces that support right-to-left (RTL) and bi-directional (Bidi) languages is essential to ensuring that our products are inclusive of global audiences. These guides, created by the Adobe International team, offer comprehensive frameworks on how to design and build for both web and mobile components."
+      "content": "Adobe Clean Spectrum VF typography guide.\n\nSpectrum 2 uses a new default font, Adobe Clean Spectrum VF. Aesthetically, this font is the same glyphs as Adobe Clean, but it has an adjusted baseline to sit vertically centered in UI. It also includes modern variable technology for width and weight axes. To support the new font, we’ve updated our default line-height values and introduced symmetrical vertical padding token values to our design system. The Spectrum 2 typography guide includes details about what’s changing, what’s staying the same, and options for updating design files or implementations. These changes are for Spectrum 2 libraries and implementations. They do not apply to Spectrum 1 components. View the Spectrum 2 typography guide"
     },
     {
       "type": "guideline",
-      "content": "The Adobe Design Brand team has created Spectrum 2-inspired desktop and mobile backgrounds for you to download."
+      "content": "Right-to-left mirroring and bi-directional language formatting guides.\n\nCreating interfaces that support right-to-left (RTL) and bi-directional (Bidi) languages is essential to ensuring that our products are inclusive of global audiences. These guides, created by the Adobe International team, offer comprehensive frameworks on how to design and build for both web and mobile components. View the RTL and Bidi formatting guide View the Mirroring for RTL languages framework"
     }
   ],
-  "sourceUrl": "https://s2.spectrum.corp.adobe.com/page/resources/",
-  "lastUpdated": "2026-02-02",
+  "sourceUrl": "https://main--spectrum-hub--adobe.aem.live/support/resources",
+  "lastUpdated": "2026-09-04",
   "status": "published",
-  "tags": ["support"],
-  "related": [{ "ref": "contact" }]
+  "tags": [
+    "Figma libraries",
+    "Design tokens",
+    "Spectrum Web Components",
+    "implementation",
+    "guides",
+    "resources"
+  ]
 }