jenn schiffer web developer, teacher, & learner

One post that I get a lot of hits from search results on is my wooden frame border-image post. I’m not surprised, because border-image is probably the most tricky and time-consuming of all the CSS properties. I decided to play around with a trickier kind of image border: the Polaroid.

This one involves a bit of math, because each border (top, right, bottom, left) are different sizes, and they change dramatically as the image size changes. I created this little form that lets you generate code for turning your own images into instant film photography.

Just copy and paste the code, and put in the URL of your image–which, sorry to say, needs to be the same proportions as the polaroid’s inside box, so you can enter the width of your image to see what the height should be.