desktop-principleslisted

> **Version-sensitive.** Every API name, SDK gate and browser-support claim below was > verified on **2026-09-08** against primary sources. What against, and when, is in > `_jutsu/VERSIONS.md`. If that date is old, re-verify before acting on a version number. # Desktop Principles > Desktop UX context. Loaded when desktop is detected (macOS, Windows, Linux desktop, web desktop). > Concise rules here. Deep-dive in `references/`. --- ## Hover States Are Mandatory Hover is the primary affordance signal on desktop, the inverse of mobile. A pointer hovering over a target without immediate visual feedback feels broken: users rely on `:hover` to confirm an element is interactive before committing to a click. Every clickable surface must have a distinct hover style, ideally with a 100-200ms transition so the change is perceptible without feeling sluggish. **CSS - hover styles for interactive elements:** ```css .button { background: var(--surface); transition: background 120ms ease-out, transform 120ms ease-out; } .button:hover { background: var(--surface-hover); transform: translateY(-1px); } .button:active { transform: translateY(0); } ``` **SwiftUI - `.onHover` is the portable hover signal; `.hoverEffect` is iOS/iPadOS-only and must be `#if`-gated:** | Modifier | Availability | Notes | |---|---|---| | `.onHover { Bool }` | iOS 13.4+, iPadOS 13.4+, Mac Catalyst 13.4+, macOS 10.15+, visionOS 1.0+ | the one that works on macOS | | `.onContinuousHover { HoverPhase }`