CSS Credit Card


See the Pen CSS Credit Card by Jack Harner (@jackharner) on CodePen.

I created a fake MasterCard using pure CSS and HTML. I used layered text-shadows to create the embossed effect on both the front and the back.

body{/*The Magic*/
text-shadow: 1px 1px 2px #000, -1px -1px 1px #fff;
	
	
	background:#333; font-family: sans-serif; text-align:center; width:100vw; color: #bababa;
	overflow:hidden;
	font-size: 1.5em;
	letter-spacing: 4px;
	position: absolute;
	text-align: center;}

See the Pen pJYjEP by Jack Harner (@jackharner) on CodePen.

/*--- Fancy Box --- */