Creating boxes and buttons with one or two corners having a diagonal edge

Hi there
What would be the best way to go about creating a div block and buttons that have angled sharp edges? It’s super easy to created rounded edges on any corner but I’m working on a project now that has an angular CI, is this at all possible? Would I just have to use an SVG I create in illustrator or can it be done with CSS somehow? I have attached the design I want to create so it’s easier to see what I mean :slight_smile:

Here is my site Read-Only: LINK
(how to share your site Read-Only link)