Why it matters
ease-in starts slowly, so the UI feels laggy right when the user expects a response. Entrances and interactions should start fast and settle (ease-out).
How to fix it
Use an ease-out curve (cubic-bezier(0.16, 1, 0.3, 1) / the --ease-out token) for enter and hover; keep ease-in for exits only.
Example
.menu[data-open] { transition: opacity 150ms var(--ease-out), transform 150ms var(--ease-out); }References
More lint rules
void lint reports 67 rules in this category. Static source checks with no browser: Tailwind v4 silent failures, Next.js 16 API traps, React render-body bugs, accessibility markup, SEO files and motion hygiene.
animate-layout-propAnimation of layout properties (width/height/top/left/margin/padding)outline-none-no-replacementFocus outline removed without a visible replacementscale-zero-entryElement enters from `scale(0)`scroll-timeline-no-fallbackBase rule hides an element; only an `@supports (animation-timeline: …)` block undoes itlong-ui-durationUI feedback transition longer than 500msno-reduced-motionAnimations present but no `prefers-reduced-motion` handling anywhereoverflow-x-hidden-sticky`overflow-x: hidden` on html/body/root wrapper breaks `position: sticky`vh-heroHero sized with `100vh` / `h-screen`