CSS slash border

Question

As seen in the picture, the background colour is magenta and the button is white. Right bottom corner of the button is not either rectangular or rounded but kind of slash off.

Can I achieve this using CSS?

Answer 1

Here is the example with new property clip-path.

You can do experiments on https://bennettfeely.com/clippy/ site

div {
  width: 100px;
  min-height: 50px;
  clip-path: polygon(0 0, 100% 0, 100% 75%, 75% 100%, 0 100%);
  background: lightblue;
}

<div class="btn">
    button
</div>