Windows 11 Start Menu Styling Guide

repository·main·Indexed 18 days ago

https://github.com/ramensoftware/windows-11-start-menu-styling-guide

A collection of styling customizations and themes for the Windows 11 Start menu, designed for use with the Windows 11 Start Menu Styler Windhawk mod. Includes guides for configuring Acrylic backgrounds, removing the search box or Recommended section, applying 2D/3D transformations, and customizing colors, brushes, and CSS for the Search menu WebView.

Tokens
108.2K
Snippets
85
Records
155
Agent score
65%

What's inside windows-11-start-menu-styling-guide

  1. Overview of the SunValley theme features

    main

    The SunValley theme recreates the design language from early Windows 11 builds. Key features include:

    • Searchbox: Recreates the searchbox from build 22000.51.
    • Labeling: Changes 'All' to 'All apps' to match older Windows 11 builds.
    • Visuals: Provides custom Acrylic backgrounds, accent color support, and both light/dark mode support.
    • Compatibility: Supports the new Windows 11 Start Menu and the new Copilot Search Menu.
    • Search Menu: Implements a Windows 10-like search menu to maintain visual consistency with the SunValley Taskbar theme.
  2. Overview of Fluid theme features

    main

    The Fluid theme for the Windows 11 Start Menu Styler aims to enhance Fluent design principles through several visual improvements:

    • 3D-like borders: Applied to most UI elements.
    • Background transitions: Added to elements that previously lacked them.
    • Context menu animations: Includes slide-in animations for context menus.
    • Scaling effects: Buttons containing images (such as in the Pinned list) feature a scaling effect.
    • Search box restyle: A redesigned appearance for the search input.
    IMPORTANT

    This theme is specifically designed for the redesigned Windows 11 Start menu introduced with the 25H2 update.

  3. Understand the ModernStartMenu theme structure

    main

    The ModernStartMenu theme is a collection of XAML-based style overrides designed for the Windows 11 Start Menu Styler. It targets specific UI elements (targets) within the Windows UI framework to apply custom visual properties like CornerRadius, Background, FontFamily, and Margin.

    Key styling patterns in this theme include:

    • Corner Radii: Extensive use of rounded corners (e.g., CornerRadius=8 for tiles, CornerRadius=4 for buttons) to create a modern aesthetic.
    • Color Variables: Uses theme-specific variables (prefixed with $, such as $buttonNormal, $tilesNormal, $menuPointerOver) to ensure consistency with the underlying system colors.
    • State-Based Styling: Many targets use @ notation to define styles for specific interaction states, such as @Normal, @PointerOver, @Pressed, and @Selected.
  4. Use the Keep Recommended button modification

    main

    This modification moves the 'Recommended' button next to the 'All' button. This allows the 'Recommended' list to remain accessible via the button without occupying permanent space on the Start menu.

    Note: The button only appears after several entries are added to the Recommended list. You may need to open several files and restart explorer to see the changes.

  5. Debug the Search Menu WebView

    main

    The Search menu uses a WebView that can be inspected using Microsoft Edge's remote debugging tools.

    1. Install the Search Menu Inspect Helper Windhawk mod.
    2. Follow the Microsoft Edge remote debugging guide for WebView2 up to step 11.
    3. Instead of step 11, install the mod and terminate the SearchHost.exe process. It will relaunch automatically with remote debugging enabled.
    4. Continue with the remaining steps in the Microsoft guide.
  6. Apply the Windows10X theme via Windhawk

    main

    The Windows10X theme, which recreates the design of the scrapped Windows 10X OS, is integrated directly into the Windows 11 Start Menu Styler mod. To apply it, follow these steps within the Windhawk application:

    1. Open the Windows 11 Start Menu Styler mod in Windhawk.
    2. Navigate to the Settings tab.
    3. Locate the theme selection option, choose the Windows10X theme, and save your settings.
    1. Open Windows 11 Start Menu Styler in Windhawk
    2. Go to 'Settings' tab
    3. Select Windows10X theme and save
  7. Configure the Hybrid theme for Windows 11 Start Menu Styler

    main

    Before importing the theme, ensure your Windows Start menu settings are configured to avoid conflicts.

    Disable the following settings in Windows:

    • "Show app list in the Start menu"
    • "Show more tiles on Start"
    • "Use Start full screen"

    Note: Right-clicking empty space in the navigation pane (e.g., between the Settings and All Apps buttons) will cause the Start menu to crash.