<div class="bag">
  <div class="handle"></div>
  <div class="top"></div>
  <div class="button"></div>
</div>

* {
  margin: 0;
}

:root{
  --background : #7f8fa6;
}

body {
  width: 100%;
  height: 100vh;
  background: var(--background);
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
}

.bag {
  width: 35vw;
  height: 25vw;
  background: rgb(48, 45, 40);
  border-radius: 0 0 4vw 4vw;
  position: relative;
  display:flex;
  justify-content:center;
  align-items:center;
}

.bag::before {
  content: "";
  position: absolute;
  background: linear-gradient(to bottom, rgb(54, 54, 54), rgb(48, 45, 40));
  width:33vw;
  height:12.5vw;
  border-radius: 0 0 3.5vw 3.5vw;
  bottom:1vw;
  border: .2vw dashed rgb(110,110,110);
  border-top:0;
}

.top{
  position: absolute;
  background:  rgb(48, 45, 40);
  width:35vw;
  height:14vw;
  border-radius: 0 0 3.5vw 3.5vw;
  top:0vw;
  display:flex;
    justify-content:center;
  align-items:center;
  border-top:0;
  box-shadow: 0 3vw 2vw rgba(0,0,0,.2)
}

.top::after{
  content: "";
  position: absolute;
  background: linear-gradient(to top, rgb(54, 54, 54), rgb(48, 45, 40));
  width:33vw;
  height:13vw;
  border-radius: 0 0 3.5vw 3.5vw;
  top:0vw;
  border: .2vw dashed rgb(110,110,110);
  border-top:0;
}

.handle{
  position:absolute;
  width:10vw;
  height:4vw;
  background: linear-gradient(to bottom, rgb(54, 54, 54), rgb(48, 45, 40));
  top:-4vw;
  border-radius:1vw 1vw 0 0;
}

.handle::after{
  content:'';
  background:var(--background);
  position:absolute;
  width:7vw;
  height:2.5vw;
  top:1.5vw;
  left:1.5vw;
  border-radius:.5vw .5vw 0 0;
}

.button{
  position:absolute;
  background:linear-gradient(to bottom, rgb(158,106,7), rgb(249,205,44),rgb(158,106,7));
  width:5vw;
  height:3vw;
  top:calc(50% - .5vw);
}