The context is an image properties dialog in a CMS backend. Here the backend user has the option to let the website visitor see (a full-size version of the) image in a lightbox when clicking it.

  • What would be a suitable icon for such an backend option, when the restrictions are a grayscale pictogram style icon of maximum 32 x 32 pixels?

In my mockup the icon looks like this:

enter image description here

Update: To be more specific concerning style, my other icons are inspired by the look of these: http://www.iconsweets2.com/


Do these help?



enter image description here

enter image description here

enter image description here

enter image description here

enter image description here

  • These are some good suggestions.
    – agib
    Apr 4 '11 at 6:59

I agree with Vitaly - but am just starting on this site so I can't vote him up. I think most users would appreciate the 4 arrows approach because it signify's full screen/larger representation pretty universally.

I don't know if there is a benefit to trying to find an icon to let them know it is specifically a LightBox vs. a full/larger screen representation.

  • Vitaly gave multiple icons. Which do you specifically find best?
    – Lode
    Apr 3 '11 at 8:17
  • Chris, I think you're right about the Lightbox/larger screen distinction. The casual backend users probably don't know/care it's called a lightbox so to them it's just a matter of providing them the opportunity to let website visitors see the image in a larger version.
    – agib
    Apr 4 '11 at 7:02
  • I like the 1st and 3rd icon. iconsweets2.com has a set of arrow icons and the last three are actually appropriate [two actually being potentially of use for the lightbox example - even though I don't like that paradigm - as agib said - they want bigger regardless of how it gets bigger]. Apr 5 '11 at 21:16


The site you linked has one in their iconSweet2 set that looks like an image pop-out (the right one). I think this is best representing a lightbox:

image pop-out from iconSweet2


BTW, iconSweets has a shop - Icon shelf - where they actually use a zoom icon to let people know they can view a larger version in a lightbox. This could be an alternative, but I guess this one works better for visitors then in the redaction backend.

zoom icon from Icon shelf

The black and white zoom overlay shows when hovering the item.

Their icon sets (iconSweet and iconSweet2) also have such zoom icons:

zoom icon from iconSweet zoom icons from iconSweet2


I don't really like the fullscreen icons, to me they mean something else. Although many users will maybe not feel any difference between fullscreen and a lightbox with grayed out background..

iconSweets2 also has one. To me, here you clearly see this means something else. However, when in another style it might work better.

fullscreen icon from iconSweet2

  • Concerning the rightmost icon in your Popout section, I actually already use something similar in another part of the GUI - here it represents image drop shadow. I have my doubts concerning the magnifier glass icon since it besides zoom also very often signifies search - so there's an inherent ambiguity. The Fullscreen icon is an okay suggestion - however, it might also refer to drag'n'drop actions.
    – agib
    Apr 4 '11 at 7:10
  • Just saw you added the iconsuites examples. I like their designs very much. Apr 5 '11 at 21:19

Not the answer you're looking for? Browse other questions tagged or ask your own question.