JSFiddle - React, Tailwind, and code Playground

HTML

<div class="vcenter-parent">
  <img onmouseenter="highlight(this)" onmouseleave="unhighlight(this)" 
       src="http://bit.ly/2e7xBXY" class="vcenter-child">
  <a href="#potato" class="vcenter-child hoverable-link">Some Link</a>
</div>

CSS

.vcenter-parent {
  display: flex;
  justify-content: center;
}

.vcenter-child {
  align-self: center;
}

.hoverable-link {
  color: gray;
}

.hoverable-link:hover {
  color: blue;
  font-weight: bold;
}

JavaScript

function highlight(image) {
	image.src = "http://bit.ly/2dSUZGO"; //Blue Image
}
function unhighlight(image) {
	image.src = "http://bit.ly/2e7xBXY"; //Gray Image
}