How do I make an element (my logo) shrink as I scroll down?

I am trying to make a company logo appear big as the page opens up and then shrink to fit inside my nav bar? How can I achieve this? I know I have to add a scroll action but which ones do I add?

Below are some examples of what I am trying to get it to look like.