Any way users engage with your interface, from clicks and hovers to scrolls and gestures. Well-designed interactions feel responsive and intuitive while providing clear feedback. Framer enables complex interactions through triggers, animations, and state changes without coding.

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.

A switch-style control for binary choices, indicating on/off or enabled/disabled states with immediate effect. Toggles differ from checkboxes in that they typically apply changes immediately rather than requiring a submit action. Use clear labeling so users understand what enabled and disabled states mean.

An input field where users can search for content within a website, essential for content-heavy sites. Search functionality helps users find specific content quickly without browsing navigation. Implement effective search with relevant results and helpful empty states.

The initial appearance of an interface when empty of user content, requiring thoughtful design to guide action. Zero states should welcome users and clearly explain how to add content. Design engaging zero states that reduce new-user confusion.

The empty area around and between design elements that gives content room to breathe and creates visual clarity. Negative space, or white space, is an active design element that improves focus and comprehension. Resist filling every available space—negative space makes designs feel premium.

A fictional character representing a target user group, created from research to guide design decisions around real needs. Personas help teams empathize with users and make consistent decisions aligned with user goals. Base personas on actual user research rather than assumptions.

Conditional Visibility is a rule-based display setting that renders elements only when defined conditions are met, improving relevance and personalization.