Skip to content

Widgets Quick Settings

prankstr edited this page Feb 18, 2026 · 6 revisions

Quick Settings

Quick settings panel with toggles and sliders for common system controls.

Options

Toggle cards in the quick settings panel:

Option Type Default Description
network bool true Network card (Wi-Fi, Ethernet, and cellular)
bluetooth bool true
vpn bool true
audio bool true
mic bool true
brightness bool true
power bool true
idle_inhibitor bool true
updates bool true
vpn_close_on_connect bool true Close panel when VPN connects
audio_scroll_percentage integer 5 Volume change per scroll tick (% points, 1-25)
background_color string Custom background color (hex)

Features

Network card: Shows Wi-Fi networks, wired ethernet connections, and cellular/mobile networks (via ModemManager, auto-detected). Supports both NetworkManager and iwd backends (auto-detected at startup, NetworkManager preferred). Supports connecting to new networks with password entry.

Volume scroll: Adjust volume by scrolling the mouse wheel while hovering the audio icon in the quick settings widget.

Bluetooth: Supports device pairing with PIN/passkey authentication dialogs when required.

VPN: Supports password-protected VPN connections. When connecting to a VPN that requires authentication, the system secret agent will prompt for credentials. The VPN card requires NetworkManager and is automatically hidden when using iwd.

Styling

Bar Widget

Class Description
.quick-settings Widget button

Popover

Class Description
.quick-settings-popover Popover container

Toggle cards:

Class Description
.qs-wifi Network (Wi-Fi/Ethernet/Mobile) toggle card
.qs-bluetooth Bluetooth toggle card
.qs-vpn VPN toggle card
.qs-updates Updates toggle card
.qs-idle-inhibitor Idle inhibitor toggle card
.qs-network-section Network type section (Ethernet, Mobile)
.qs-network-section-row Network section header row
.qs-network-section-label Network section header label
.qs-network-row Network connection row
.qs-network-connection-row Active network connection row
.qs-mobile-disabled-icon Mobile disabled icon state

Popover slider rows:

Class Description
.qs-audio-output Audio output slider row
.qs-audio-mic Microphone input slider row
.qs-brightness Brightness slider row

Clone this wiki locally