Как делают скриншоты с hover эффектом?

Есть несколько способов, включая правку в граф. редакторе.
Другие способы: переключение состояния hover в инспекторе browser-a, редактирование стилей (скажем, можно добавить в css класс .hover к селекторам, где есть псевдокласс :hover и присвоить такой класс нужным элементам). А можно и просто сделать скриншот, наведя курсор на нужный элемент.