Spectrum Design Data
  • Components
  • Tokens
  • Registry
  • AI
  • Specification
  • Tools
  • Color handle

    Token Type Value Resolved Deprecated Deprecated comment Replaced by
    color-handle-border-width alias {border-width-200} 2px No - -
    color-handle-drop-shadow-blur dimension 0 0 No - -
    color-handle-drop-shadow-color alias {drop-shadow-color} light: rgba(0, 0, 0, 0.12)
    dark: rgba(0, 0, 0, 0.36)
    wireframe: rgba(0, 0, 0, 0.12)
    Yes Express does not need a separate design for Color loupe and Color handle components Replaced by drop-shadow-color
    color-handle-drop-shadow-x dimension 0 0 No - -
    color-handle-drop-shadow-y dimension 0 0 No - -
    color-handle-inner-border-color alias {black} rgb(0, 0, 0) No - -
    color-handle-inner-border-opacity opacity 0.42 0.42 No - -
    color-handle-inner-border-width dimension 1px 1px No - -
    color-handle-outer-border-color alias {black} rgb(0, 0, 0) No - -
    color-handle-outer-border-opacity alias {color-handle-inner-border-opacity} 0.42 No - -
    color-handle-outer-border-width dimension 1px 1px No - -
    color-handle-size scale-set - desktop: 16px
    mobile: 20px
    No - -
    color-handle-size-key-focus scale-set - desktop: 32px
    mobile: 40px
    No - -