Image Size

Hi,

We are in developing a feature to switch the system between (Simple Interface) and (Pro Interface), the simple interface will be as simple as possible, which is standard menu and toolbars, but the Pro interface will be with Ribbons and tabs and so on...

What is the best scenario for the images in order to be clear in both interfaces?

Because for now, I'm using a 32*32px PNG images, which looks GREAT in the ribbon, but after switching to the simple interface (which contains toolbars with 24*24 or 16*16 icons) the images will look bad and not clear.

What is the best practice in order to make it clear in both interfaces (without duplications), because I don't want to make each image twice with both sizes, if so, it will be clear, but with duplication.

See images:

Pro Interface:

Simple Interface:

Thanks.

I just tested your suggestion  and it works fine, actually too smart that the library chose the large icon in case of large, and the small one at the same time.

I went through the following scenario, I made PNG images for all large images, and ICO for the small images, and both with the same name (the extension is different only), and  I just switched between them... 

nice one , thank you..

PS: it will be nice if you can develop this suggestion, which is to choose the best size from an Icon with multiple sizes, I mean, in Icon designing, you can put different sizes for the same icon, and MS Windows will choose the best according to your windows settings.. I tested it in your component but it didn't worked, so it  will be good to develop such thing, so no duplicate files will be in the project..

Anyway, thank you for your help.