Harmonious display of logos with JavaScript

whether references, partners or customers - there are many cases where you want to display several logos next to each other in a harmonious way. the proportions of the logos are usually not uniform. often you follow your gut feeling when it comes to the size representation in the design, but there is also an exact calculation method of a visually appealing representation by equating the areas of the logos. in the following example, this can be done with a few lines of JavaScript.

If you equate the height, you get the following appearance:


If you do the same procedure with the width, the following illustration results:


Better is the equalization of the area with the help of a few lines of JavaScript:


This gives the following picture: