How to create a beautiful header on the site?

Question

Layout

I want to create a trapezoid on the site in the header (+ so that the edges do not shrink when reduced). Animation when hovering the cursor is not really needed, but if you can, thank you)

Answer 1

You can also do this: https://codepen.io/anon/pen/vjxYog with header rotation and animation

Answer 2

In theory, you can just make such a picture and put it on the background of the header.

Answer 3

https://codepen.io/topicstarter/pen/PeWRbb?editors=1100 so you can