Rules Hub
Code Ruleset
← Back to all rules
Rule priority, scope & exceptions
Use this to align rules with the senior-level structure (P0/P1/P2, scope, exceptions/tradeoffs).
frontend ruleP2universalStack: css
cssuxlinkshover
Add a hover state to links even when the design omits one
Provide a hover color for links/buttons as a baseline interaction affordance even if the design spec doesn't specify it.
PR: hegnar-web · org-mining-hist-2026-06Created: Jun 19, 2026
Bad example
Old codetsx
| 1 | <a className="text-blue-500 font-semibold">More</a> |
Explanation (EN)
An interactive control without feedback can be difficult to distinguish from static text.
Objašnjenje (HR)
Good example
New codetsx
| 1 | <a className="text-blue-500 font-semibold hover:text-blue-600">More</a> |
Explanation (EN)
Objašnjenje (HR)
Notes (EN)
For an interactive link or button, verify that hover and keyboard focus communicate affordance with sufficient contrast and match the existing design system.
Exceptions / Tradeoffs (EN)
Do not use hover as the sole indication of interactivity or invent a hover state for disabled/noninteractive content.