Angle shape with only CSS

Question

Screenshot

I'm trying to achieve the shape via the picture attached, however I'm not going the right angles.

Answer 1

.angle {
  --offset: 30px;

  background: steelblue;
  width: 250px;
  height: 40px;
  clip-path: polygon(0 0, 100% 0, calc(100% - var(--offset)) 100%, 0% 100%);
}

<div class="angle"></div>

in the above snippet I used clip-path to cut a portion of the rectangle. to learn more about it you can check the MDN web docs