Making a universal button for any background color.

There are no innovative ideas in the subject, such things have already been used at least once :)

Task: 88x31 button, showing, for example, CY and PR. The background color of the page on which it will be placed is unknown, and so that the button does not look like a foreign object, we will make it universally suitable for any background color.

I use the Adobe Fireworks program, but the same can be done in almost any editor.

So, create a rectangle of 88x31 pixels (1 in Figure 1) with a vertical gradient fill of # 000000 with an opacity of 50% in # 000000 with an opacity of 0%.
')
A rectangle of 88x31 pixels (2 in Figure 1) with a vertical gradient fill of #FFFFFF with an opacity of 10% in #FFFFFF with an opacity of 50%.

A rectangle of 84x14 pixels (3 in Figure 1) with a vertical gradient fill of #FFFFFF with an opacity of 10% in #FFFFFF with an opacity of 30%.

A rectangle of 88x31 pixels (5 in Figure 1) with a frame # 999999.

Logo with the name (4 in Figure 1) and text (6 in Figure 1).

Below we see what happened in the assembled form. We save the resulting APG with the alpha channel and can use the chameleon button on any background.

Picture 1:

Figure 2 (button with different background colors):

Actually, this way you can use any prepared picture.