Как создать прямой угол (угол в виде прямой линии) с помощью HTML и CSS?

Для создания прямого угла с помощью HTML и CSS можно использовать псевдоэлементы `::before` и `::after`. 

Пример кода:

HTML:
```html
<div class="angle"></div>
```

CSS:
```css
.angle {
  position: relative;
  width: 100px;
  height: 100px;
  background-color: #333;
}

.angle::before, .angle::after {
  content: '';
  position: absolute;
  width: 50px;
  height: 50px;
  background-color: #fff;
}

.angle::before {
  top: 0;
  right: 0;
  border-bottom: 2px solid #333;
  border-left: 2px solid #333;
}

.angle::after {
  bottom: 0;
  left: 0;
  border-top: 2px solid #333;
  border-right: 2px solid #333;
}
```

Этот код создаст прямоугольный блок с одним из углов в виде прямой линии. 

Для создания углов, похожих на изображенные на картинке, можно использовать свойства `border` для создания треугольников, аналогичных углам на картинке. Или использовать изображения в качестве фонов для элемента.