State
The current condition of a component or interface element, such as default, hover, active, loading, or error. Managing state effectively enables responsive, interactive experiences. Design all relevant states and transitions between them.
Cursor
The visual indicator showing the mouse position on screen, which changes shape to indicate possible interactions. Custom cursors can reinforce branding and provide feedback about interactive elements. In Framer, the cursor becomes contextual tools for placing elements and manipulating the canvas during design.
Drag
An interaction where users click and hold an element to move it, common for reordering lists, sliders, and drawing interfaces. Drag interactions should provide clear visual feedback about what's being moved and where it can be dropped. Consider touch device behavior where drag competes with scrolling gestures.
Hover State
The visual appearance of an element when a user's cursor is positioned over it, providing feedback and indicating interactivity. Hover states are essential for buttons, links, and clickable elements—without them, users can't tell what's interactive. Remember that hover doesn't exist on touch devices, so don't rely on it for essential information.