how to add animation to a button hover code example

Example 1: css hover

.a:hover{background-color: black;}

Example 2: on hover css

/* Changes an element's color on hover */

.selector {
	background-color: black;
}

.selector:hover {
	background-color: blue;
}

Example 3: how to add animation to a button hover

.btn {
  background-color: #ddd;
  border: none;
  color: black;
  padding: 16px 32px;
  text-align: center;
  font-size: 16px;
  margin: 4px 2px;
  transition: 0.3s;
}

.btn:hover {
  background-color: #3e8e41;
  color: white;
}