HTML CSS JS JavaScript document.write("JavaScript is a simple language for javatpoint learners"); HTML <input type="checkbox" class="openMenu" id="openMenu"/> <label for="openMenu" class="ToggleIcon"> <div class="spinner diagonal part-1"></div> <div class="spinner horizontal"></div> <div class="spinner diagonal part-2"></div> </label> CSS /* Toggle Icon Burger) */ .ToggleIcon { transition: all 0.3s; box-sizing: border-box; cursor: pointer; position: absolute; z-index: 99; height: 100%; width: 100%; top: 27px; /* jarak icon burger dari atas */ right: 27px; /* jarak icon burger dari kanan */ height: 22px; /* sesuaikan ukuran */ width: 22px; } .spinner { transition: all 0.3s; box-sizing: border-box; position: absolute; height: 3px; width: 100%; background-color: #fff; display:block; } .horizontal { transition: all 0.3s; box-sizing: border-box; position: relative; float: left; margin-top: 3px; } .diagonal.part-1 { position: relative; transition: all 0.3s; box-sizing: border-box; float: left; } .diagonal.part-2 { transition: all 0.3s; box-sizing: border-box; position: relative; float: left; margin-top: 3px; }