باید با استفاده از css اینکار را انجام دهید

Html

<div class="hexagon"></div>

Css

.hexagon {
  position: relative;
  width: 300px; 
  height: 173.21px;
  background-color: #64C7CC;
  margin: 86.60px 0;
}

.hexagon:before,
.hexagon:after {
  content: "";
  position: absolute;
  width: 0;
  border-left: 150px solid transparent;
  border-right: 150px solid transparent;
}

.hexagon:before {
  bottom: 100%;
  border-bottom: 86.60px solid #64C7CC;
}

.hexagon:after {
  top: 100%;
  width: 0;
  border-top: 86.60px solid #64C7CC;
}

OutPut

ممنون بابت تمام راهنمایی ها.

من الان عکسمو باید تو تگ div بندازم؟

دکمه های عقب جلو اسلاید با جی کوئری پیاده سازی کنم؟

ممنون

خیر میتونید استایل ها رو مستقیم به عکس بدید

برای مورد دوم بله