How to create a color of the same brightness and saturation?

Let's consider three colors: Red, Green and Blue. For blue I created a specific shade, something like #F2F5F7. If you see this color, it has a certain level of shade, brightness and saturation value of blue.

I want to create the same equivalent color but for Green and Red, how to get that?

Answer

This is exactly what the HSB colour model is for. You have almost exactly named the model's variables in your question:

• Hue is the 'kind' of colour: red, blue, orange, yellow;


• Saturation is inverse with the amount of white you add to the hue;


• Brightness is inverse with the amount of black you add.

So, to take your example colour of #F2F5F7. you can convert this into HSB in Photoshop or Illustrator's colour picker, yielding H=203, S=1, B=96 as HSB values.

All you have to do now is change the H to the hue you want. For a green, try H=83 and leave the S and B values intact. This is converted by the colour picker right away and yields #f3f4f2.