<a class="button">Press Me</a>
body {
background-color: aliceblue;
display: grid;
place-items: center;
height: 100vh;
}
.button {
background-color: #fff;
border: 1px solid #cacaca;
border-radius: 4px;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
color: #ff7a18;
cursor: pointer;
padding: 15px 25px;
transition: all 0.1s ease-in;
}
.button:hover {
box-shadow: none;
color: #777;
}
.button:active {
box-shadow: inset 0 2px 5px rgba(0, 0, 0, 0.25);
}
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.