Move image to top of page

What value would you set the Y axis to move a square div that is flex centered in the middle of the page to the exact top of the page. Setting a value like -300 px doesn’t seem appropriate as the spacing from centre to top of screen will vary depending on browser size?

The overarching effect I’m looking to achieve is to move a logo from the middle of the page on load to the top nav bar.

-300px isn’t relative to viewport boundaries.
Exact top - maybe use absolute position. top: 0; (relative to the body).