Hexagon Menu

To achive this section you have edit this following codes

<div class="hexagon-menu clear">
 <div class="hexagon-item">
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <a href="welcome.html" class="hex-content">
 <span class="hex-content-inner">
 <span class="icon">
 <i class="tf-dial"></i>
 </span>
 <span class="title">Welcome</span>
 </span>
 <svg viewBox="0 0 173.20508075688772 200" height="200" width="174" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M86.60254037844386 0L173.20508075688772 50L173.20508075688772 150L86.60254037844386 200L0 150L0 50Z" fill="#1e2530"></path></svg>
 </a>
 </div>
 <div class="hexagon-item">
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <a href="about.html" class="hex-content">
 <span class="hex-content-inner">
 <span class="icon">
 <i class="tf-profile-male"></i>
 </span>
 <span class="title">About</span>
 </span>
 <svg viewBox="0 0 173.20508075688772 200" height="200" width="174" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M86.60254037844386 0L173.20508075688772 50L173.20508075688772 150L86.60254037844386 200L0 150L0 50Z" fill="#1e2530"></path></svg>
 </a>
 </div>
 <div class="hexagon-item">
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <a href="services.html" class="hex-content">
 <span class="hex-content-inner">
 <span class="icon">
 <i class="tf-tools-2"></i>
 </span>
 <span class="title">Services</span>
 </span>
 <svg viewBox="0 0 173.20508075688772 200" height="200" width="174" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M86.60254037844386 0L173.20508075688772 50L173.20508075688772 150L86.60254037844386 200L0 150L0 50Z" fill="#1e2530"></path></svg>
 </a>
 </div>
 <div class="hexagon-item">
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <a href="resume.html" class="hex-content">
 <span class="hex-content-inner">
 <span class="icon">
 <i class="tf-tools"></i>
 </span>
 <span class="title">Resume</span>
 </span>
 <svg viewBox="0 0 173.20508075688772 200" height="200" width="174" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M86.60254037844386 0L173.20508075688772 50L173.20508075688772 150L86.60254037844386 200L0 150L0 50Z" fill="#1e2530"></path></svg>
 </a>
 </div>
 <div class="hexagon-item">
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <a href="works.html" class="hex-content">
 <span class="hex-content-inner">
 <span class="icon">
 <i class="tf-briefcase2"></i>
 </span>
 <span class="title">Works</span>
 </span>
 <svg viewBox="0 0 173.20508075688772 200" height="200" width="174" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M86.60254037844386 0L173.20508075688772 50L173.20508075688772 150L86.60254037844386 200L0 150L0 50Z" fill="#1e2530"></path></svg>
 </a>
 </div>
 <div class="hexagon-item">
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <a href="testimonials.html" class="hex-content">
 <span class="hex-content-inner">
 <span class="icon">
 <i class="tf-chat"></i>
 </span>
 <span class="title">Testimonials</span>
 </span>
 <svg viewBox="0 0 173.20508075688772 200" height="200" width="174" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M86.60254037844386 0L173.20508075688772 50L173.20508075688772 150L86.60254037844386 200L0 150L0 50Z" fill="#1e2530"></path></svg>
 </a>
 </div>
 <div class="hexagon-item">
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <a href="contact.html" class="hex-content">
 <span class="hex-content-inner">
 <span class="icon">
 <i class="tf-envelope2"></i>
 </span>
 <span class="title">Contact</span>
 </span>
 <svg viewBox="0 0 173.20508075688772 200" height="200" width="174" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M86.60254037844386 0L173.20508075688772 50L173.20508075688772 150L86.60254037844386 200L0 150L0 50Z" fill="#1e2530"></path></svg>
 </a>
 </div>
</div> <!– /.hexagon-menu –>

To add more blocks you have to just copy and paste this following codes

<div class="hexagon-item">
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <div class="hex-item">
 <div></div>
 <div></div>
 <div></div>
 </div>
 <a href="welcome.html" class="hex-content">
 <span class="hex-content-inner">
 <span class="icon">
 <i class="tf-dial"></i>
 </span>
 <span class="title">Welcome</span>
 </span>
 <svg viewBox="0 0 173.20508075688772 200" height="200" width="174" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M86.60254037844386 0L173.20508075688772 50L173.20508075688772 150L86.60254037844386 200L0 150L0 50Z" fill="#1e2530"></path></svg>
 </a>
</div>
Improve this page on Github  — Last updated:  Thu, Oct 19, 2023