Create a 3d button with CSS

Do you need a realistic 3d button for your website ?

Check The code I have posted below.

The HTML

<button>Click Me</button>

The CSS

button {
	background: #2f2f2f;
	border: none;
	padding: 10px 20px;
	font-size: 14px;
	border-radius: 4px;
	color: #c4c4c4;
	box-shadow:
		1px 1px 5px #000,
		-1px -1px 5px #6f6f6f,
		inset 1px 1px 5px #2b2b2b,
		inset -1px -1px 5px #424242;
	transition: all 0.1s;
}
body {
	background: #2f2f2f;
}
button:active {
	box-shadow:
		1px 1px 5px #5b5b5b,
		-1px -1px 5px #000,
		inset 1px 1px 5px #5b5b5b,
		inset -1px -1px 5px #000;
}