Created
August 27, 2026 05:17
-
-
Save graste/ae3f39d78e5c59bbef09930acf10d2b3 to your computer and use it in GitHub Desktop.
Hover proximity CSS https://blog.master.dev/hover-proximity-using-modern-css/
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| img:hover { /* the main element */ | |
| scale: 1.5; | |
| } | |
| img:hover + *, /* the 1st next element */ | |
| img:has(+ *:hover) { /* the 1st previous element */ | |
| scale: 1.2; | |
| } | |
| img:hover + * + *, /* the 2nd next element */ | |
| img:has(+ * + *:hover) { /* the 2nd previous element */ | |
| scale: 1.1; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment