Drag & Drop Basics
Move cards, reorder columns, and rearrange your workflow with one of the smoothest drag-and-drop interfaces in any project tool.
Overview
Gryphin's drag-and-drop is built on native pointer events with predictive positioning, spring physics, and full keyboard fallback. Multi-select, auto-scroll, and snap-to-column all work the way you'd expect.
Refresh empty states
Bulk move performance
Drag preview animation
WebKit pointer fix
Spring animations
What you can drag
Cards between columns
Click, hold, drag, drop. Status updates automatically — automations fire on the new column.
Reorder within a column
Drag up or down to set priority. Other cards smoothly reshuffle around your target position.
Reorder columns
Grab a column header and drag horizontally to rearrange your workflow stages.
Multi-select drag
Shift-click multiple cards (or Ctrl-click on Windows) and drag them as a group.
Visual cues
Three feedback signals tell you exactly what's about to happen:
Blue insertion line
Shows the precise spot the card lands. Hovers between cards or at column top/bottom.
Column lift & glow
The target column gently lifts and gains a subtle blue glow — your "yes, this is valid" signal.
Red outline for invalid drops
Trying to drop into a locked column or out of scope? You'll see a red outline and feel a haptic nudge on touch devices.
Touch & mobile
Long-press to grab
Hold 300ms on any card to pick it up. A subtle vibration confirms it's ready to move.
Auto-scroll at edges
Drag near the left or right edge to scroll horizontally. Drag near top/bottom for vertical scroll.
Two-finger pan
Browse the board without picking up cards. Two-finger scrolling never triggers a drag.
Keyboard navigation
Every drag operation has a keyboard equivalent — fully accessible, fully fluent:
Accessibility-first by design
Every drag interaction has a non-pointer alternative. We test with VoiceOver, NVDA, and JAWS as part of our release process.
Keyboard shortcutsWas this article helpful?
Let us know how we can improve