• Light
  • Dark
  • Darkest
  • Medium
  • Large
  • LTR
  • RTL
  • Default
  • Express

Drop indicator

Component status
Contribution
Current version@spectrum-css/dropindicator@5.1.1
ReleasedMay 22, 2024
S2-foundations@spectrum-css/dropindicator@6.0.0-s2-foundations.9
ReleasedJuly 16, 2024
View repository
GitHub
View package
npm

Usage notes

A Drop Indicator is used to show the insertion position into a list or table.

Variants

Standard
Contribution

Show markup
<div style="display: flex; align-items: center">
  <div class="spectrum-DropIndicator spectrum-DropIndicator--vertical" style="height: 300px; margin: 100px;"></div>
  <div class="spectrum-DropIndicator spectrum-DropIndicator--horizontal" style="width: 300px;"></div>
</div>