Login

u/Octopusmafia_First

Image 1 — Windhawk Taskbar Styler + Taskbar on Top + Taskbar height and Icon size Config + Start Menu Styler
Image 2 — Windhawk Taskbar Styler + Taskbar on Top + Taskbar height and Icon size Config + Start Menu Styler
▲ 9 r/Windhawk

Windhawk Taskbar Styler + Taskbar on Top + Taskbar height and Icon size Config + Start Menu Styler

Thought I'd share my windhawk configs, as I'm pretty proud of them. Taskbar is kind of a mixture between the Luminosity and Liquid glass presets (should work on the bottom as well, but might require editing).

theme: ''
styleConstants:
  - ''
controlStyles:
  - target: Taskbar.TaskListLabeledButtonPanel
    styles:
      - VerticalAlignment=Center
  - target: Taskbar.TaskbarFrame
    styles:
      - HorizontalAlignment=Stretch
  - target: Taskbar.TaskbarFrame > Grid#RootGrid
    styles:
      - Margin=8,4,8,4
      - CornerRadius=8
      - Background:=<WindhawkBlur BlurAmount="20" TintColor="#251E2228"/>
  - target: Taskbar.TaskbarBackground#HoverFlyoutBackgroundControl > Grid > Rectangle#BackgroundFill
    styles:
      - Fill:=<WindhawkBlur BlurAmount="20" TintColor="#221E2228"/>
      - Margin=0
  - target: Taskbar.TaskListLabeledButtonPanel > Border#BackgroundElement
    styles:
      - Background=Transparent
      - CornerRadius=4
  - target: Taskbar.TaskListLabeledButtonPanel@CommonStates > Border#BackgroundElement
    styles:
      - Background@InactiveNormal:=<SolidColorBrush Color="Transparent"/>
      - Background@InactivePointerOver:=<SolidColorBrush Color="#1F5D7287"/>
      - Background@InactivePressed:=<SolidColorBrush Color="#335D7287"/>
      - Background@ActiveNormal:=<SolidColorBrush Color="#335D7287"/>
      - Background@ActivePointerOver:=<SolidColorBrush Color="#4D5D7287"/>
      - Background@ActivePressed:=<SolidColorBrush Color="#4D5D7287"/>
      - Background@MultiWindowNormal:=<SolidColorBrush Color="#666f7287"/>
      - Background@MultiWindowActive:=<SolidColorBrush Color="#335D7287"/>
      - CornerRadius=4
      - Margin=1,-2,1,-2
      - BorderThickness=0
  - target: Taskbar.TaskListLabeledButtonPanel@RunningIndicatorStates > Rectangle#RunningIndicator
    styles:
      - Fill=Transparent
      - Fill@ActiveRunningIndicator={ThemeResource SystemAccentColorDark1}
      - Fill@InactiveRunningIndicator=#5D7287
      - RadiusX=2
      - RadiusY=2
      - Height=2
      - Width=14
      - Width@ActiveRunningIndicator=18
      - Margin=0,0,0,30
  - target: Border#BackgroundElement
    styles:
      - BorderThickness=0
  - target: Border#MultiWindowElement
    styles:
      - Background:=<SolidColorBrush Color="#666f7287"/>
      - CornerRadius=4
      - BorderThickness=1
      - Margin=2,0,-2,0
  - target: Border#OverflowFlyoutBackgroundBorder
    styles:
      - Background:=<WindhawkBlur BlurAmount="20" TintColor="#221E2228"/>
      - BorderThickness=1
      - BorderBrush=#353B45
      - CornerRadius=8
  - target: MenuFlyoutPresenter > Border
    styles:
      - Background:=<WindhawkBlur BlurAmount="20" TintColor="#221E2228"/>
      - BorderThickness=1
      - BorderBrush=#353B45
      - CornerRadius=8
      - Padding=3,4,3,4
  - target: SystemTray.NotifyIconView#NotifyItemIcon
    styles:
      - MinWidth=20
      - MaxHeight=40
  - target: SystemTray.OmniButton#ControlCenterButton
    styles:
      - MaxHeight=40
  - target: Grid#ConfirmatorMainGrid
    styles:
      - Background:=<WindhawkBlur BlurAmount="20" TintColor="#CC1E2228"/>
      - BorderThickness=0
  - target: Grid
    styles:
      - RequestedTheme=2
  - target: Taskbar.TaskbarFrame > Grid#RootGrid > Taskbar.TaskbarBackground > Grid > Rectangle#BackgroundFill
    styles:
      - Visibility=Collapsed
  - target: Rectangle#BackgroundStroke
    styles:
      - Visibility=Collapsed
themeResourceVariables:
  - ''
xamlDiagnosticsHandling: ''theme: ''
styleConstants:
  - ''
controlStyles:
  - target: Taskbar.TaskListLabeledButtonPanel
    styles:
      - VerticalAlignment=Center
  - target: Taskbar.TaskbarFrame
    styles:
      - HorizontalAlignment=Stretch
  - target: Taskbar.TaskbarFrame > Grid#RootGrid
    styles:
      - Margin=8,4,8,4
      - CornerRadius=8
      - Background:=<WindhawkBlur BlurAmount="20" TintColor="#251E2228"/>
  - target: Taskbar.TaskbarBackground#HoverFlyoutBackgroundControl > Grid > Rectangle#BackgroundFill
    styles:
      - Fill:=<WindhawkBlur BlurAmount="20" TintColor="#221E2228"/>
      - Margin=0
  - target: Taskbar.TaskListLabeledButtonPanel > Border#BackgroundElement
    styles:
      - Background=Transparent
      - CornerRadius=4
  - target: Taskbar.TaskListLabeledButtonPanel@CommonStates > Border#BackgroundElement
    styles:
      - Background@InactiveNormal:=<SolidColorBrush Color="Transparent"/>
      - Background@InactivePointerOver:=<SolidColorBrush Color="#1F5D7287"/>
      - Background@InactivePressed:=<SolidColorBrush Color="#335D7287"/>
      - Background@ActiveNormal:=<SolidColorBrush Color="#335D7287"/>
      - Background@ActivePointerOver:=<SolidColorBrush Color="#4D5D7287"/>
      - Background@ActivePressed:=<SolidColorBrush Color="#4D5D7287"/>
      - Background@MultiWindowNormal:=<SolidColorBrush Color="#666f7287"/>
      - Background@MultiWindowActive:=<SolidColorBrush Color="#335D7287"/>
      - CornerRadius=4
      - Margin=1,-2,1,-2
      - BorderThickness=0
  - target: Taskbar.TaskListLabeledButtonPanel@RunningIndicatorStates > Rectangle#RunningIndicator
    styles:
      - Fill=Transparent
      - Fill@ActiveRunningIndicator={ThemeResource SystemAccentColorDark1}
      - Fill@InactiveRunningIndicator=#5D7287
      - RadiusX=2
      - RadiusY=2
      - Height=2
      - Width=14
      - Width@ActiveRunningIndicator=18
      - Margin=0,0,0,30
  - target: Border#BackgroundElement
    styles:
      - BorderThickness=0
  - target: Border#MultiWindowElement
    styles:
      - Background:=<SolidColorBrush Color="#666f7287"/>
      - CornerRadius=4
      - BorderThickness=1
      - Margin=2,0,-2,0
  - target: Border#OverflowFlyoutBackgroundBorder
    styles:
      - Background:=<WindhawkBlur BlurAmount="20" TintColor="#221E2228"/>
      - BorderThickness=1
      - BorderBrush=#353B45
      - CornerRadius=8
  - target: MenuFlyoutPresenter > Border
    styles:
      - Background:=<WindhawkBlur BlurAmount="20" TintColor="#221E2228"/>
      - BorderThickness=1
      - BorderBrush=#353B45
      - CornerRadius=8
      - Padding=3,4,3,4
  - target: SystemTray.NotifyIconView#NotifyItemIcon
    styles:
      - MinWidth=20
      - MaxHeight=40
  - target: SystemTray.OmniButton#ControlCenterButton
    styles:
      - MaxHeight=40
  - target: Grid#ConfirmatorMainGrid
    styles:
      - Background:=<WindhawkBlur BlurAmount="20" TintColor="#CC1E2228"/>
      - BorderThickness=0
  - target: Grid
    styles:
      - RequestedTheme=2
  - target: Taskbar.TaskbarFrame > Grid#RootGrid > Taskbar.TaskbarBackground > Grid > Rectangle#BackgroundFill
    styles:
      - Visibility=Collapsed
  - target: Rectangle#BackgroundStroke
    styles:
      - Visibility=Collapsed
themeResourceVariables:
  - ''
xamlDiagnosticsHandling: ''

Ideally the active running indicator would be the accent color of the windows theme but I've noticed its a little inconsistent.

Next is my start menu styler, based heavily off the metro10minimal style but a little more translucent to match the taskbar. 

theme: Windows11_Metro10Minimal
disableNewStartMenuLayout: '1'
styleConstants:
  - CommonBgBrush=<WindhawkBlur BlurAmount="25" TintColor="#25323232"/>
controlStyles:
  - target: Border#AcrylicBorder
    styles:
      - Background:=$CommonBgBrush
      - BorderThickness=0
      - CornerRadius=15
  - target: Border#AcrylicOverlay
    styles:
      - Visibility=Collapsed
  - target: Border#BorderElement
    styles:
      - Background:=<WindhawkBlur BlurAmount="25" TintColor="#15000000"/>
      - BorderThickness=0
      - CornerRadius=10
  - target: MenuFlyoutPresenter > Border
    styles:
      - Background:=<WindhawkBlur BlurAmount="25" TintColor="#22000000"/>
      - BorderThickness=1
  - target: Border#AppBorder
    styles:
      - Background:=$CommonBgBrush
      - BorderThickness=0
      - CornerRadius=15
  - target: Border#AccentAppBorder
    styles:
      - Background:=$CommonBgBrush
      - BorderThickness=0
      - CornerRadius=15
  - target: Border#LayerBorder
    styles:
      - Visibility=Collapsed
  - target: Border#TaskbarSearchBackground
    styles:
      - Background:=<WindhawkBlur BlurAmount="25" TintColor="#15000000"/>
      - BorderThickness=0
      - CornerRadius=10
      - MaxWidth=460
  - target: ToolTip > ContentPresenter#LayoutRoot
    styles:
      - Background:=<WindhawkBlur BlurAmount="25" TintColor="#22000000"/>
  - target: Cortana.UI.Views.TaskbarSearchPage Border#dropshadow
    styles:
      - CornerRadius=16
      - Margin=-12
  - target: Cortana.UI.Views.TaskbarSearchPage > Grid#RootGrid
    styles:
      - RenderTransform:=<TranslateTransform X="-199" Y="-110"/>
  - target: StartDocked.StartSizingFrame
    styles:
      - MinWidth=460
      - MaxWidth=460
      - MaxHeight=670
  - target: Cortana.UI.Views.TaskbarSearchPage
    styles:
      - Width=460
  - target: Grid#RootGrid
    styles:
      - Width=460
      - MaxHeight=670
  - target: Grid#OuterBorderGrid
    styles:
      - MaxHeight=670
  - target: Grid#BorderGrid
    styles:
      - MaxHeight=670
themeResourceVariables:
  - ''
webContentStyles:
  - target: '#scopesHeader'
    styles:
      - 'display: none !important'
  - target: .scope-with-background__rightCaret, .scope-with-background__leftCaret
    styles:
      - 'display: none !important'
  - target: '#qfPreviewPane'
    styles:
      - 'display: none !important'
  - target: '#topHitHeader'
    styles:
      - 'display: none !important'
webContentCustomJs: ''theme: Windows11_Metro10Minimal
disableNewStartMenuLayout: '1'
styleConstants:
  - CommonBgBrush=<WindhawkBlur BlurAmount="25" TintColor="#25323232"/>
controlStyles:
  - target: Border#AcrylicBorder
    styles:
      - Background:=$CommonBgBrush
      - BorderThickness=0
      - CornerRadius=15
  - target: Border#AcrylicOverlay
    styles:
      - Visibility=Collapsed
  - target: Border#BorderElement
    styles:
      - Background:=<WindhawkBlur BlurAmount="25" TintColor="#15000000"/>
      - BorderThickness=0
      - CornerRadius=10
  - target: MenuFlyoutPresenter > Border
    styles:
      - Background:=<WindhawkBlur BlurAmount="25" TintColor="#22000000"/>
      - BorderThickness=1
  - target: Border#AppBorder
    styles:
      - Background:=$CommonBgBrush
      - BorderThickness=0
      - CornerRadius=15
  - target: Border#AccentAppBorder
    styles:
      - Background:=$CommonBgBrush
      - BorderThickness=0
      - CornerRadius=15
  - target: Border#LayerBorder
    styles:
      - Visibility=Collapsed
  - target: Border#TaskbarSearchBackground
    styles:
      - Background:=<WindhawkBlur BlurAmount="25" TintColor="#15000000"/>
      - BorderThickness=0
      - CornerRadius=10
      - MaxWidth=460
  - target: ToolTip > ContentPresenter#LayoutRoot
    styles:
      - Background:=<WindhawkBlur BlurAmount="25" TintColor="#22000000"/>
  - target: Cortana.UI.Views.TaskbarSearchPage Border#dropshadow
    styles:
      - CornerRadius=16
      - Margin=-12
  - target: Cortana.UI.Views.TaskbarSearchPage > Grid#RootGrid
    styles:
      - RenderTransform:=<TranslateTransform X="-199" Y="-110"/>
  - target: StartDocked.StartSizingFrame
    styles:
      - MinWidth=460
      - MaxWidth=460
      - MaxHeight=670
  - target: Cortana.UI.Views.TaskbarSearchPage
    styles:
      - Width=460
  - target: Grid#RootGrid
    styles:
      - Width=460
      - MaxHeight=670
  - target: Grid#OuterBorderGrid
    styles:
      - MaxHeight=670
  - target: Grid#BorderGrid
    styles:
      - MaxHeight=670
themeResourceVariables:
  - ''
webContentStyles:
  - target: '#scopesHeader'
    styles:
      - 'display: none !important'
  - target: .scope-with-background__rightCaret, .scope-with-background__leftCaret
    styles:
      - 'display: none !important'
  - target: '#qfPreviewPane'
    styles:
      - 'display: none !important'
  - target: '#topHitHeader'
    styles:
      - 'display: none !important'
webContentCustomJs: ''

Should you center the taskbar, the start menu will require some editing to match.

I use both of these configs with a slightly edited TranslucentShell notification center config: 

theme: TranslucentShell
styleConstants:
  - ''
controlStyles:
  - target: ControlCenter.ControlCenterPage
    styles:
      - VerticalAlignment=Stretch
      - RenderTransform:=<RotateTransform Angle="180" />
      - RenderTransformOrigin=0.5,0.5
  - target: ControlCenter.ControlCenterPage > Grid#RootGrid
    styles:
      - VerticalAlignment=Stretch
      - RenderTransform:=<RotateTransform Angle="180" />
      - RenderTransformOrigin=0.5,0.5
  - target: ControlCenter.ControlCenterPage > Grid#RootGrid > Grid#RootContent
    styles:
      - VerticalAlignment=Top
  - target: ActionCenter.NotificationCenterPage > Grid#RootGrid > Grid#RootContent
    styles:
      - RowDefinitions:=<RowDefinitionCollection><RowDefinition Height="Auto"/><RowDefinition Height="500"/></RowDefinitionCollection>
      - VerticalAlignment=Top
      - CornerRadius=10
      - Padding=0,0,0,-33
  - target: ActionCenter.NotificationCenterPage > Grid#RootGrid > Grid#RootContent > Grid#NotificationCenterGrid
    styles:
      - MaxHeight=4000
  - target: ActionCenter.NotificationCenterPage > Grid#RootGrid > Grid#RootContent > Grid#CalendarCenterGrid
    styles:
      - Height=8455
      - Padding=0,0,0,8000
themeResourceVariables:
  - ''theme: TranslucentShell
styleConstants:
  - ''
controlStyles:
  - target: ControlCenter.ControlCenterPage
    styles:
      - VerticalAlignment=Stretch
      - RenderTransform:=<RotateTransform Angle="180" />
      - RenderTransformOrigin=0.5,0.5
  - target: ControlCenter.ControlCenterPage > Grid#RootGrid
    styles:
      - VerticalAlignment=Stretch
      - RenderTransform:=<RotateTransform Angle="180" />
      - RenderTransformOrigin=0.5,0.5
  - target: ControlCenter.ControlCenterPage > Grid#RootGrid > Grid#RootContent
    styles:
      - VerticalAlignment=Top
  - target: ActionCenter.NotificationCenterPage > Grid#RootGrid > Grid#RootContent
    styles:
      - RowDefinitions:=<RowDefinitionCollection><RowDefinition Height="Auto"/><RowDefinition Height="500"/></RowDefinitionCollection>
      - VerticalAlignment=Top
      - CornerRadius=10
      - Padding=0,0,0,-33
  - target: ActionCenter.NotificationCenterPage > Grid#RootGrid > Grid#RootContent > Grid#NotificationCenterGrid
    styles:
      - MaxHeight=4000
  - target: ActionCenter.NotificationCenterPage > Grid#RootGrid > Grid#RootContent > Grid#CalendarCenterGrid
    styles:
      - Height=8455
      - Padding=0,0,0,8000
themeResourceVariables:
  - ''

Both configs would probably require some small edits to translate for a different screen, I'm on 2880x1800 at 175% scaling for reference. Claude AI made this possible, though it did struggle, thanks to the data centers I suppose.

Wallpaper credit to Jake Hills on Unsplash: https://unsplash.com/photos/snow-covered-mountain-under-blue-sky-during-daytime-z0gDv24X3uQ

u/Octopusmafia_First — 6 days ago