Makes a square as large as possible in the viewport without overflowing and centres it vertically and horizontally - https://twitter.com/mikeriethmuller/status/769922629260181504

hull-height-square.css

.elem {
  width: 100vmin;
  height: 100vmin;
  margin-top: calc((100vh - 100vmin)/2);
  margin-left: calc((100vw - 100vmin)/2);
}