CSS3 holds a ton of cool new features that browsers are finally supporting(CMON IE, CATCH UP!). One such addition is 3d transforms. With this I was able to accomplish adding a perspective to an image.

That is a normal setup to display an image. Now lets give it some perspective with CSS

.image_container
{
        perspective: 750px;
        -moz-perspective: 750px;
        -ms-perspective: 750px;
        -o-perspective: 750px;
        -webkit-perspective:750px;

        transform-style: preserve-3d;
        -moz-transform-style: preserve-3d;
        -ms-transform-style: preserve-3d;
        -o-transform-style: preserve-3d;
        -webkit-transform-style: preserve-3d;
}
.image_container img
{
       transform: rotate3d(0,1,0,45deg);
       -moz-transform: rotate3d(0,1,0,45deg);
       -ms-transform: rotate3d(0,1,0,45deg);
       -o-transform: rotate3d(0,1,0,45deg);
       -webkit-transform: rotate3d(0,1,0,45deg);
			
}

This css can remarkably change the image’s look and gives it a vanishing point perspective. Please note this not work on Internet Explorer 9 or earlier, but it will still display the image like usual.