How to create a hexagonal block with borders using css?

Question

css

It is necessary to lay out such hexagonal blocks, in which the borders on one side will be of the same color and width, on the other side of a different color and width. Is it really possible to create using css? And what would be the best option?

Answer 1

With CSS: https://css-tricks.com/examples/ShapesOfCSS/
Personally, I would do it with SVG.