Styling Settings
Theme Selection
- Theme: Select a ready-to-use theme. Choose Custom to unlock manual color controls:
- Dark (Default): Classic dark theme with white text
- Light: Clean light theme with dark text
- Colorful: Vibrant multi-color theme
- Gradient: Beautiful gradient background
- Glass Morphism: Modern frosted glass effect
- Minimal: Clean, minimal design
- Neon Glow: Eye-catching neon effect
- Ocean Breeze: Calming blue ocean theme
- Sunset: Warm orange and pink theme
- Matte Gray: Professional matte finish
- Pastel Dream: Soft pastel colors
- Cyber Dark: Futuristic dark theme
- Custom: Unlocks all color customization options
Shadow Settings
- Menu Shadow: Add depth with a drop shadow behind the menu (default:
Enabled). - Shadow Intensity: Select how soft or strong the shadow should appear (appears when Menu Shadow is Enabled):
- Light: Subtle shadow for minimal depth
- Medium: Balanced shadow (default, recommended)
- Heavy: Strong shadow for maximum depth
Color Customization (Custom Theme Only)
The following color options only appear when Theme is set to "Custom":
- Menu Bar Background Color: Select the background color for the menu bar (default: Dark gray
#1a1a1a). - Menu Item Hover Background Color: Select the background color when hovering over menu items (default: Dark gray
#2a2a2a). - Menu Bar Border Color: Select the border color for the menu bar (default:
rgba(255, 255, 255, 0.1)).
Color Customization (All Themes)
- Active Menu Item Color: Select the color for the active/selected menu item (default: Blue
#007bff). The module automatically detects the current page and highlights the corresponding menu item. - Menu Text Color: Select the primary text color for menu labels (default: White
#ffffff). Works with all themes. - Menu Text Hover Color: Select the text color when hovering over menu items (default: Blue
#007bff). Works with all themes.
Typography & Icon Sizes
- Menu Icon Size: Size of the menu icons in pixels (default:
20, range: 12-32px). - Menu Text Size: Font size for the menu labels in pixels (default:
11, range: 8-16px). - Social Icon Size: Size of the social icons displayed on the right in pixels (default:
18, range: 12-32px).
Animation & Effects
- Micro Animations: Add subtle hover and active transitions for a premium feel (default:
Enabled). - Ripple Tap Effect: Show a Material Design ripple effect when tapping menu buttons (appears when Micro Animations is Enabled, default:
Enabled). This creates a modern, interactive feel similar to mobile apps.