Cambiar el color de fondo con efecto hover con CSS

Como cambiar el color de fondo con efecto hover con CSS. Es sencillo con CSS3 gracias a «transition». Es sencillo como dije y más abajo te dejo el código y el ejemplo para que lo puedas usar y adaptar a tu proyecto.

a {
  background-color: red;
  transition: background-color 0.5s;
}

a:hover {
  background-color: blue;
}

Ejemplo de como cambiar el color de fondo con efecto hover con CSS

<div class="cuadro">
</div>

<style>
.cuadro{
width:200px;
height:200px;
/* AQUÍ COMIENZA TODO */
background-color: red;
/* ojo a esto */
transition: background-color 0.5s;
}

.cuadro:hover{
background-color: blue;
}
</style>