Spectrum Design Data
  • Components
  • Tokens
  • Registry
  • AI
  • Specification
  • Tools
  • Switch

    Token Type Value Resolved Deprecated Deprecated comment Replaced by
    switch-control-height-extra-large scale-set - desktop: 20px
    mobile: 26px
    No - -
    switch-control-height-large scale-set - desktop: 18px
    mobile: 22px
    No - -
    switch-control-height-medium scale-set - desktop: 16px
    mobile: 20px
    No - -
    switch-control-height-small scale-set - desktop: 14px
    mobile: 18px
    No - -
    switch-control-width-extra-large scale-set - desktop: 34px
    mobile: 46px
    No - -
    switch-control-width-large scale-set - desktop: 30px
    mobile: 38px
    No - -
    switch-control-width-medium scale-set - desktop: 26px
    mobile: 34px
    No - -
    switch-control-width-small scale-set - desktop: 22px
    mobile: 30px
    No - -
    switch-handle-selected-size-extra-large scale-set - desktop: 14px
    mobile: 20px
    No - -
    switch-handle-selected-size-large scale-set - desktop: 12px
    mobile: 16px
    No - -
    switch-handle-selected-size-medium scale-set - desktop: 10px
    mobile: 14px
    No - -
    switch-handle-selected-size-small scale-set - desktop: 8px
    mobile: 12px
    No - -
    switch-handle-size-extra-large scale-set - desktop: 12px
    mobile: 18px
    No - -
    switch-handle-size-large scale-set - desktop: 10px
    mobile: 14px
    No - -
    switch-handle-size-medium scale-set - desktop: 8px
    mobile: 12px
    No - -
    switch-handle-size-small scale-set - desktop: 6px
    mobile: 10px
    No - -
    switch-top-to-control-extra-large scale-set - desktop: 15px
    mobile: 19px
    Yes Use semantic token base-padding-vertical-extra-large instead. Requires switch control to be placed in frame of height workflow-icon-extra-large Replaced by base-padding-vertical-extra-large
    switch-top-to-control-large scale-set - desktop: 12px
    mobile: 15px
    Yes Use semantic token base-padding-vertical-large instead. Requires switch control to be placed in frame of height workflow-icon-large Replaced by base-padding-vertical-large
    switch-top-to-control-medium scale-set - desktop: 9px
    mobile: 11px
    Yes Use semantic token base-padding-vertical-medium instead. Requires switch control to be placed in frame of height workflow-icon-medium Replaced by base-padding-vertical-medium
    switch-top-to-control-small scale-set - desktop: 6px
    mobile: 7px
    Yes Use semantic token base-padding-vertical-small instead. Requires switch control to be placed in frame of height workflow-icon-small Replaced by base-padding-vertical-small