Как сверстать такой шестиугольник?

Question

[Bart Simpson]

Как сверстать такой шестиугольник ? (чтоб внутрь можно было вставить картинку)


Получается коряво:
https://codepen.io/IvaLu/pen/ZEXyWYK

Answer 1

[Алексей Дубровин]

Первое шо загуглилось, вроде нормально.
В вашем случае я бы просто в svg это выгружал. А не пытался самому это сделать.
На svg можно также вешать событие hover

Answer 2

[Одиночка Айс]

Генератор - brenna.github.io/csshexagon Остальное, как уже сказали, можно через svg иконку

Answer 3

[Legal Adviser]

Я бы попробовал бы сделать три прямоугольника внутри одного квадрата. А иконку саму свж абсолютом.