What problem does it solve? Applying Material Design 3 shape guidelines consistently is difficult because corner radius values, component-specific rules, and the new M3 Expressive shape library are spread across dense specification documents. This Skill provides the complete shape token system and per-component rules so interfaces follow M3 Expressive shape and containment principles correctly. ## Core Features & Use Cases - Shape Token System: Defines the full M3 Expressive corner radius scale (None through Extra Extra Large and Full) as CSS custom properties with semantic component tokens. - Component Shape Guidelines: Provides exact border-radius rules for buttons, cards, dialogs, bottom sheets, text fields, chips, FABs, and segmented button groups. - Expressive Shapes and Morphing: Covers the 35-shape M3 Expressive library with clip-path and border-radius implementations plus shape morphing transitions for state feedback. - Use Case: When building a dialog component in a design system, use this Skill to apply the correct 32dp extra-large radius, define the shape tokens, and add a smooth morphing transition on expansion. ## Quick Start Apply Material Design 3 shape guidelines to style my card and dialog components with the correct corner radius tokens.
