CodePen проекта:

С html думаю и так все понятно, более интересным будет CSS:
Тег * {} - означает свойства для всех объектов. Там мы убераем нижнее подчеркивание ссылок и убераем отступы на странице.
В body задаем цвет фона (В нашем случае это темно-серый цвет)
Дальше указываем отступы наших категорий друг от друга, задаем размеры категориям и изменение категорий при их навидении курсором, ну и собственно цвет (я выбрал оранжевый).
В теге hidden-menu указываем то, что будет появляться из левого края при нажатии кнопки бургера. Это фон контейнера, наши категории, а так же их появления при нажатии на кнопку.
btn-menu это и есть наш бургер, в нем мы подбераем размеры, фиксацию и тд.
Ну а дальше играемся с анимацией и изменением положения бургера, так как мы не используем JS, сделать это не очень просто.