Profile card

Hi there ✌️

Congrats on completing this challenge!! 🥳🎉

Solving your question... I have always said that there is more than one solution to a problem 😄, Your way of solving it, it was great.

I leave you another way of how I could have done it... 🙃

body {
  position: relative;
  overflow: hidden;
}
body::before {
  content: "";
  position: absolute;
  top: -300px;
  left: -300px;
  width: 600px;
  height: 600px;
  background-image: url("../images/bg-pattern-top.svg");
  background-size: cover;
  z-index: 5;
}
body::after {
  content: "";
  position: absolute;
  bottom: -300px;
  right: -300px;
  width: 600px;
  height: 600px;
  background-image: url("../images/bg-pattern-bottom.svg");
  background-size: cover;
  z-index: 5;
}

As you can see, using the position property and pseudo-elements is another way to do it.

I hope I've helped you 😄

Happy coding!! ✌️