<div class="eraser-wrapper">
<!--   <div class="text">for neat & clean erasing</div> -->
  <div class="blob">
  </div>
  <div class="text">
   <div>non</div>
   <div>dust</div>
   <div>eraser</div>
  </div>
  <div class="eraser"></div>
</div>
@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
html {
  box-sizing: border-box;
  scroll-behavior: smooth;
}
*,
*::before,
*::after {
  box-sizing: inherit;
}
* {
  margin: 0;
  padding: 0;
}
body {
  display: grid;
  place-items: center;
  min-height: 100vh;
  background: #ececec;
}
.eraser-wrapper {
  width: 40vmin;
  height: 25vmin;
  border-radius: 1vmin;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: linear-gradient(#7ea246 4% ,#0175a2 5%, #0175a2 75%, #f7f7f7 76%, #f7f7f7 94%, #a7a7a7);
  position: relative;
  filter: drop-shadow(0 0 6px #a7a7a7);
  // .text {
  //   position: absolute;
  //   bottom: 1.5vmin;
  //   font-family: 'Roboto', sans-serif;
  //   left: 3.8vmin;
  //   font-size: 3.1vmin;
  // }
  .blob {
    width: 50vmin;
    height: 22vmin;
    background: #8fbd40;
    clip-path: circle(50% at 90% 120%);
    position: absolute;
    right: 0;
    top: -3.2vmin;
  }
  .text {
    position: absolute;
    right: 4vmin;
    font-family: 'Roboto', sans-serif;
    color: #fff;
    
    div {
      line-height: 1;
      position: relative;
      
      &:nth-child(1){
        font-size: 4vmin;
        font-weight: 500;
        left: 1.8vmin;
        top: .6vmin;
        letter-spacing: 0.5vmin;
      }
      &:nth-child(2){
        font-size: 5.5vmin;
        font-weight: 700;
        left: -2vmin;
        letter-spacing: 0.4vmin;
      }
      &:nth-child(3){
        font-size: 3vmin;
        font-weight: 100;
        letter-spacing: .5vmin;
        color: #f3f3f3;
        left: 1vmin;
        top: -.5vmin;
      }
    }
  }
  .eraser {
    width: 15vmin;
    height: 23.5vmin;
    border-radius: 1vmin 0 0 1vmin;
    position: absolute;
    left: -14vmin;
    background: linear-gradient(#f8f7fb 2%, #dfe3ec 94% ,#c0c4c7);
    // border: 1px solid #eee;
  }
}
View Compiled

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.