The web 2.0 mirror effect in 1 minute with Adobe Fireworks

Web 2.0 mirror effect example created in Fireworks

Everybody has seen this mirror effect in modern webdesign. Maybe you have an overdose by now, but I want to show how simple it is to create such effect in Fireworks. In this tutorial movie I demonstrate how to create such mirror effect in approx. 1 minute.


  1. Heh. Or you can load the image in Carousel and crop a screenshot of it. That now takes about 20 seconds. :-D

  2. @Nathan: thank you for trashing my article with your comment (you yellow-haired, yellow-bleeding… ok stop ;-)). Let me just add to this that your screenshot probably won’t be that “pixel perfect” :-).
    @Chris: you’re welcome!

  3. Y’know I’m just teasing you. ;-)

    Thanks for the article. It’s actually also quite easy to get that effect in Photoshop, you just have to know how to apply a blending gradient to a layer.

  4. Nice and easy.
    I’m mostly pleased that for once it’s a Fireworks tip instead of a Photoshop one.
    I’m a simple developer in need for simple graphical tools. I’ve been using Fireworks for years now, and just love it.

  5. Theo, I agree. I’m not that good in Photoshop, I always return to Fireworks if I need “simple”. I see amazing Photoshop tutorials and sometimes I use them, but without really knowing what I’m doing (just moving from step 1 to 10).

  6. O, it is excellent to have a giant’s strength; but it is tyrannous to use it like a giant.

  7. Hi, I was made alone with Photoshop header for my new shop!I make it my self ‘cos I do not have lot of monay to pay some PRO. I just buy image from fotolia and make a header before 2 months. I’m selling in that shop ebooks. But now when I looking all around maybe that is not so good idea that header with monay in the theets (maybe that not attracct people, i do not have now after 2 monaths lot of visits on site) maybe is better that I was put some blond business girl as image in header! I’m not webdesigner?? What do you think about my header, what would you like to change, what would you like to put in header??? Please answer me??
    Here is my shop
    or click here ebook shop

    Ant that mirror efect is wonderfull , It’s look so easy to make it but when I open My Photoshop (old version 4.0) I’m getting crazy from all that buttons and possibilities!!

  8. First of all: it’s not because you create a website, that you automatically attract visitors. You should promote it, and read about Google rankings and stuff.
    About the header: the color scheme looks a bit oldskool to me, and I’m not fond of the, eh, font you use. Bold,3d,… all combined in one doesn’t look good to me in the end. Simpler is better.
    And: don’t use Comic Sans MS. It looks cheap, it’s everywhere and it’s bad taste. It’s what you see at office when people want to get rid of Arial and are in a creative mood. It reminds me of the little jumping matchstick guy from MS Word you see everywhere :-S.
    Then, the red buttons. Too much, too old! The lips are nice though…
    These are my opinions, and at-first-glance look. Hope it helped.

  9. Nice job! Thanks for the quick tut!


Leave a Reply to Martin Vereecken Cancel reply

Your email address will not be published. Required fields are marked *

13 − = 11

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>