Take Dramatic 3D Screenshots of Websites with Firefox

Mozilla 3D Developer Preview

If you do a lot of presentations or tutorials about technology, you probably have to take screenshots of websites to illustrate your ideas. I really like to add a “wow” factor to my presentations whenever I can do it gracefully, and I’ve been using Firefox’s 3D Developer Preview to add visual interest to website screenshots.


Just load up the site you want to talk about in Firefox, fire up the 3D Developer Preview of it, and take a screenshot. Here’s how:

How do you do it?

  1. Familiarize yourself with Firefox 3d Developer Preview.
  2. Navigate to the website you want to screenshot
  3. Pull down Firefox’s Developer Tools menu and enter 3D Prevew
  4. Position your website in the most awesome way possible
  5. Shoot and edit your screenshot with your favorite screen capture software like Jing, Skitch, or good ol’ Grab in OSX
  6. Drop that screenshot into your presentation, document, or whatever creative piece you’re working on!

It’s really that simple! I’d love to see what you do with this tool– please leave links to your 3D presentations in the comments!


Liked this post? Follow this blog to get more.