For Live Demo: Click here

CSS Code:

body { margin:0px auto;}

#content{margin:0px auto; width:200px;}

#arrow-top
{
	width:0px;
	height: 0px;
	
	border-bottom: 30px solid #999;
	border-left: 30px solid transparent;
	border-right: 30px solid transparent;
}

#arrow-right
{
	width:0px;
	height: 0px;
	
	border-top: 30px solid transparent;
	border-bottom: 30px solid transparent;
	border-left: 30px solid #777;	
}

#arrow-bottom
{
	width:0px;
	height: 0px;
	
	border-top: 30px solid #444;
	border-left: 30px solid transparent;
	border-right: 30px solid transparent;
}

#arrow-left
{
	width:0px;
	height: 0px;
	
	border-top: 30px solid transparent;
	border-bottom: 30px solid transparent;
	border-right: 30px solid #000;	
}

HTML Code:

	
Arrow Using CSS:
	

	

	

	

	

	

	

For Live Demo: Click here