Eu tenho o seguinte código: (Violino)

body {
  background-color: red;
}
#grad1 {
  height: 100px;
  width: 100%;
  background: linear-gradient(521deg, rgba(138, 138, 138, 0) 50%, rgba(138, 138, 138, 0) 31.9%, #fff 0.1%, #fff 0%);
}

<div id="grad1"></div>

Basicamente, quero que a largura seja responsiva e a forma do gradiente seja mantida, mesmo que a largura mude.

O que eu tentei:

Defina a largura para 100%, isso não funciona porque é uma div vazia

É isso, não tenho outras idéias para ser honesto. Eu apreciaria se alguém pudesse ajudar.

É para isso que estou usando: (as imagens são apenas um exemplo para mostrar o que acontece / o que quero dizer)

Mas se eu tiver um dispositivo maior, isso acontece: