YASB GUI is a graphical configuration application designed to simplify the setup and management of YASB Reborn (Yet Another Status Bar). Built with WinUI 3, this modern interface allows users to configure their status bar settings visually, eliminating the need for manual YAML file editing.
Key Features:
Visual Configuration Editor: Create and modify status bar elements using an intuitive graphical interface.
Monaco-based YAML Editor: Edit configuration files with syntax highlighting, validation, and real-time schema checks.
Widget Management: Add, remove, and configure widgets directly within the application, supporting all YASB widget types.
Styles Editor: Customize your status bar appearance with a built-in CSS editor featuring syntax highlighting and auto-completion.
Environment Variable Manager: Easily edit and manage environment variables used by YASB.
Audience & Benefit:
Ideal for users who prefer a graphical interface over manual YAML editing, YASB GUI streamlines configuration management. It reduces the risk of errors through real-time validation and provides visual tools to enhance productivity while maintaining customization flexibility.
YASB GUI can be installed via winget, ensuring a seamless setup process for Windows users.
README
YASB GUI
YASB GUI is a native configuration application for YASB Reborn (Yet Another Status Bar). Built with WinUI 3, it provides a modern interface for managing your status bar configuration without manually editing YAML files.
> Note: This application is currently in beta. Some features may be incomplete or subject to change. Please report any issues on the GitHub Issues page.
Why a separate repository?
YASB GUI is maintained separately from YASB for several reasons:
Built with WinUI 3, which requires Windows App SDK dependencies not needed by YASB itself
Keeps YASB lightweight and focused on its core functionality without GUI framework bloat
Allows independent development cycles and easier maintenance for both projects
Users who prefer manual YAML editing don't need to install unnecessary GUI dependencies
Features
Visual Configuration Editor
Edit bars, widgets, and global settings through an intuitive interface
Monaco-based code editor with YAML syntax highlighting and validation
Real-time schema validation for configuration files
Widget Management
Add, remove, and configure widgets with a visual editor
Support for all YASB widget types
Widget-specific settings panels
Styles Editor
Built-in CSS editor for customizing your status bar appearance
Microsoft Edge WebView2 Runtime (included with Windows 10/11)
Installation
Download the latest release from the Releases page.
Add a widget using a docs snippet (how it actually works)
Go to Widgets → Add Widget.
Pick the widget from the built-in list.
In the Options editor, paste only the options block from the docs-not the outer widgets: list. Real example (Weather widget) with nested options and indentation kept:
label: "{icon} {temp}"
label_alt: "{location}: Min {min_temp}, Max {max_temp}"
api_key: "YOUR_API_KEY"
show_alerts: true
tooltip: true
update_interval: 600
hide_decimal: true
units: metric
menu:
blur: true
round_corners: true
round_corners_type: normal
border_color: system
alignment: center
direction: down
offset_top: 6
offset_left: 0
icons:
sunnyDay: "\ue30d"
clearNight: "\ue32b"
cloudyDay: "\ue312"
cloudyNight: "\ue311"
rainyDay: "\ue318"
rainyNight: "\ue318"
snowyIcy: "\ue31a"
default: "\ue137"
callbacks:
on_left: toggle_menu
Save the widget, then hit Apply so YASB reloads the updated config.
> Tips
>
> Copy only the options section from the docs and paste it into the Options editor; the widget type is already set by your selection.
>
> If indentation looks off, right-click in the editor and choose Fix indentation from the context menu.
Configuration
The application reads and writes YASB configuration from:
~/.config/yasb/config.yaml
~/.config/yasb/styles.css
To use a custom location, set the YASB_CONFIG_HOME environment variable.
Contributing Translations
YASB GUI supports multiple languages. Translation files are located in app/core/locales/.
To add a new language:
Copy en.json and rename it using the language code (e.g., fr.json for French)
Update _language_name and _language_code at the top of the file
Translate all string values while keeping the keys unchanged
Do not modify placeholders (e.g., {variable}) within the strings
