Find free codes for designing beautiful menus with effects.

Category: Menu

Menus are one of the most important parts of each website, since they navigate users through different sections. For sure beautiful menus have more effects in attracting users. Below, you can find a menu suit you and your site.

 Home  Help 

CSS3 dropdown menu with notifications and numbers

Dropdown Menu with Notifications

CSS3 dropdown menu with notifications and numbers

Vertical accordion menu with icons and numbers.

Vertical Accordion Menu

Vertical accordion menu with icons and numbers.

A simple horizontal menu at the page footer with auto-hide effect.

Horizontal Footer Menu

A simple horizontal menu at the page footer with auto-hide effect.

Circular menu with show and hide buttons.

Circular Hide Show Menu

Circular menu with show and hide buttons.



Auto hiding left sidebar menu, opens on hover.

Auto-hide Sidebar Menu

Auto hiding left sidebar menu, opens on hover.

Fullscreen and transparent menu with close button

Fullscreen Transparent Menu

Fullscreen and transparent menu with close button

Sliding menu floats from left to right by an animation.

Sliding Menu with Animation

Sliding menu floats from left to right by an animation.

Multilevel auto-expanding menu with sliding animation.

Multilevel Floating Menu

Multilevel auto-expanding menu with sliding animation.

Off screen menu appears with animation when the menu button is clicked.

Stylish off-Screen Menu

Off screen menu appears with animation when the menu button is clicked.

Various types of navigation menu bars with underline effect.

Various Horizontal Navigation Menus

Various types of navigation menu bars with underline effect.

Pure CSS menu code with the effect of displaying the text of each item next to its icon in hover mode.

Menu With Effect On Hover

Pure CSS menu code with the effect of displaying the text of each item next to its icon in hover mode.

A beautiful hamburger menu that opens in the form of a circular animation, after clicking on it, and returns to the same state by clicking again, and . . .

Hamburger Menu with Semicircular Effect

A beautiful hamburger menu that opens in the form of a circular animation, after clicking on it, and returns to the same state by clicking again, and . . .

This is a dark-themed menu with menu items marked with icons, and each icon rotates to red in hover mode. In addition, this code is pure CSS and does . . .

Dark Menu With Rotate Menu Items

This is a dark-themed menu with menu items marked with icons, and each icon rotates to red in hover mode. In addition, this code is pure CSS and does . . .

Several beautiful effect models for menu items in hover mode that slide, create lines around and fill in the text or add text below it to your site in . . .

Several examples of menu effects in hover . . .

Several beautiful effect models for menu items in hover mode that slide, create lines around and fill in the text or add text below it to your site in . . .

In this code we have a menu that opens with the help of a button and the whole screen is displayed. Full time screen has a black background and is slightly . . .

HTML Full Page Navigation Menu

In this code we have a menu that opens with the help of a button and the whole screen is displayed. Full time screen has a black background and is slightly . . .

In this code, the menu is opened by clicking on a button, and each menu item is a triangle, which creates a hexagon when these triangles are placed next . . .

Centered Hexagonal Menu with Images

In this code, the menu is opened by clicking on a button, and each menu item is a triangle, which creates a hexagon when these triangles are placed next . . .

The menus in this code are located in the corner and there is a hamburger button that we can click to open the menu and the menu will also be displayed . . .

Triangular Menu in the Page Corner.

The menus in this code are located in the corner and there is a hamburger button that we can click to open the menu and the menu will also be displayed . . .

Clicking a button in the corner of the website page will bring up the menu and tilt the website slightly. Each item within the website also has an icon.

Menu with Web Page Turn Over Effect

Clicking a button in the corner of the website page will bring up the menu and tilt the website slightly. Each item within the website also has an icon.

In this code we have a simple menu that the items of this menu change color in hover mode. This menu also has an icon.

Simple HTML Dark Menu with Icons

In this code we have a simple menu that the items of this menu change color in hover mode. This menu also has an icon.

In this post, we have a menu that each item has an icon and by selecting each icon, the background color changes.

Dynamic Stylish Menu Code with Hover and . . .

In this post, we have a menu that each item has an icon and by selecting each icon, the background color changes.

In this code we have a number of items in our circular menu. Each item in this menu has a different color. The items are all circular.

CSS Circular Collapsing and Expanding Menu . . .

In this code we have a number of items in our circular menu. Each item in this menu has a different color. The items are all circular.

We have a horizontal menu in this code. This menu has a dark theme and by selecting one of the menu items, displays submenus with animation.

CSS Hanging Menu with Animation

We have a horizontal menu in this code. This menu has a dark theme and by selecting one of the menu items, displays submenus with animation.

In this post, menus with display mode on mobile have been prepared for you. The color theme of these menus is also blue and purple.

Pure CSS 3D Mobile Menu

In this post, menus with display mode on mobile have been prepared for you. The color theme of these menus is also blue and purple.

In this post, we have a hamburger button that can be clicked to see a menu on the mobile. This menu is displayed along with the animation.

HTML Navigation Menu in Mobile Template

In this post, we have a hamburger button that can be clicked to see a menu on the mobile. This menu is displayed along with the animation.

In this post, we have a menu in the size bar. This menu has several submenu levels and by clicking on each of the items with submenu, you can see its . . .

Multi Level Menu in CSS

In this post, we have a menu in the size bar. This menu has several submenu levels and by clicking on each of the items with submenu, you can see its . . .

In this post on the left side of the page we have a menu with a black theme and each menu item includes an icon. Selecting each item menu changes the . . .

HTML Left Sidebar with Full Screen Items . . .

In this post on the left side of the page we have a menu with a black theme and each menu item includes an icon. Selecting each item menu changes the . . .

In this post, each menu item contains an effect on its titles. In addition to changing the color of the item titles, the items are displayed with animation.

CSS Menu with Animated Items Texts on Hover

In this post, each menu item contains an effect on its titles. In addition to changing the color of the item titles, the items are displayed with animation.

In this post, a menu is displayed by clicking on a button. This menu is horizontal and each menu item is displayed with an icon.

Full Screen Menu with Horizontal Items

In this post, a menu is displayed by clicking on a button. This menu is horizontal and each menu item is displayed with an icon.

No menu is displayed in this code, and the pink menu is displayed by clicking on the hamburger button. This is a full screen menu.

HTML Full Screen Pink Menu

No menu is displayed in this code, and the pink menu is displayed by clicking on the hamburger button. This is a full screen menu.

In this post, we have provided a code for the full page menu of the website that you can use. This code displays the items along with the animation. The . . .

Mobile Menu Code with Toggle Button

In this post, we have provided a code for the full page menu of the website that you can use. This code displays the items along with the animation. The . . .

In this post, the website menu is displayed by clicking on the button in the middle of the page. The background of the menu is black with a bit of clarity.

CSS Full Screen Menu with Float in Effect

In this post, the website menu is displayed by clicking on the button in the middle of the page. The background of the menu is black with a bit of clarity.

In this post, clicking on the hamburger button opens a full-screen menu with a blue background color. This menu has white items.

Transparent Full Screen Menu Code

In this post, clicking on the hamburger button opens a full-screen menu with a blue background color. This menu has white items.

In this post, the menu opens with a button in the middle of the page. Menu items are displayed in a circle around the button. Menu items themselves have . . .

Circular Collapsible Menu Code with Toggle . . .

In this post, the menu opens with a button in the middle of the page. Menu items are displayed in a circle around the button. Menu items themselves have . . .

In this post we have a horizontal menu. This menu, along with the animation on its texts, has become more beautiful during the time of Hover. In addition . . .

Pure CSS Menu Code with Icons and Hover . . .

In this post we have a horizontal menu. This menu, along with the animation on its texts, has become more beautiful during the time of Hover. In addition . . .

The menu items in this post are all white. The menu itself is located as a sidebar on the left side of the screen. Each item clicked has a curved background.

Sliding Sidebar Menu Code

The menu items in this post are all white. The menu itself is located as a sidebar on the left side of the screen. Each item clicked has a curved background.

In this post, the menu opens horizontally with the click of a button. This menu, along with an effect for hover time, lightens the background a bit.

HTML Collapsible and Expandable Horizontal . . .

In this post, the menu opens horizontally with the click of a button. This menu, along with an effect for hover time, lightens the background a bit.

This sidebar is pink and opens by clicking on the toggle button. The buttons inside the sidebar are white and are shown with animation.

HTML Left Sidebar with Zoom in/out Items

This sidebar is pink and opens by clicking on the toggle button. The buttons inside the sidebar are white and are shown with animation.

The background of this code is two colors with a blue tone. By clicking on the close button, the menu items along with the animation will be removed and . . .

HTML Toggle Menu with Collapsing/Expanding . . .

The background of this code is two colors with a blue tone. By clicking on the close button, the menu items along with the animation will be removed and . . .

Menu items each contain an icon. Selecting any item changes the background color. Gradient background color is always composed of two colors.

Javascript Navigation Menu with Dynamic . . .

Menu items each contain an icon. Selecting any item changes the background color. Gradient background color is always composed of two colors.

In this code we have a header that changes the background of this header by selecting menu items. Each menu item has a different color. The dotted lines . . .

Page Transition with Play Header Menu Tabs

In this code we have a header that changes the background of this header by selecting menu items. Each menu item has a different color. The dotted lines . . .

In this code, a menu is composed of only gray icons. By clicking on any of the menu items, the icon will be colored and start moving.

Tabbar animation - Only CSS

In this code, a menu is composed of only gray icons. By clicking on any of the menu items, the icon will be colored and start moving.

In this code, we have a tab that, like slides, each item that is selected moves a blue oval and is placed on it.

Sliding Tabs | CSS Transitions Only

In this code, we have a tab that, like slides, each item that is selected moves a blue oval and is placed on it.

In this code, we have prepared vertical menus with icons with different color themes that you can use according to the color theme of your website.

Light/Dark Admin Dashboard Menus with Tailwind . . .

In this code, we have prepared vertical menus with icons with different color themes that you can use according to the color theme of your website.

In this post we have a menu that is located at the bottom of the page. Each menu item contains only one icon and no text for its title.

Dynamic Navigation Menu Code with Icons

In this post we have a menu that is located at the bottom of the page. Each menu item contains only one icon and no text for its title.

What are You Looking for?


Site Logo
  • About us
  • Contact us
  • How to Use?
  • Suggested
Free Frontend
Code Free Tutorial
CSS Free Code
Graphic Photo World


© Kerixa inc. All Rights Reserved.