Dragged state

When an interface includes draggable elements (such as being able to reorder a playlist), it’s essential to create a dragged state.^[1] When an element is held and moved from one place to another, it enters this state.

One of the most effective ways to indicate a dragged state is with a smooth shadow that indicates elevation as if the element was being lifted. Lowering the opacity of surrounding elements can also assist in this state. Be sure to include some visual cue for where the dragged element will be placed when it is released.