back to top
Menu Close

waybar style css file

this is the code used in the waybar style.css file.

/* =============================================================================
 *
 * Waybar configuration
 *
 * Configuration reference: https://github.com/Alexays/Waybar/wiki/Configuration
 *
 * =========================================================================== */
 
/* -----------------------------------------------------------------------------
 * Keyframes
 * -------------------------------------------------------------------------- */


/*
Polar Night
nord0  #2e3440
nord1  #3b4252
nord2  #434c5e
nord3  #4c566a
Snow Storm
nord4  #d8dee9
nord5  #e5e9f0
nord6  #eceff4
Frost
nord7  #8fbcbb
nord8  #88c0d0
nord9  #81a1c1
nord10 #5e81ac
Aurora
nord11 #bf616a
nord12 #d08770
nord13 #ebcb8b
nord14 #a3be8c
nord15 #b48ead
*/

/* -----------------------------------------------------------------------------
 * Base styles
 * -------------------------------------------------------------------------- */
 
/* Reset all styles */

* {
    color: #fffe39;
    border: 0;
    border-radius: 0;
    padding: 0 0;
    font-family:Digital-7;
    font-size: 24px;
    margin-right: 5px;
    margin-left: 5px;
    padding-bottom:0px;
    padding-top: 0px;
   }

window#waybar {
    background:#000000;
    border: 2px;
    border-color: #3f00ff;
    border-style: solid;
    border-radius: 5px 5px 5px 5px;
    margin-top:2px;
}

#workspaces button {
	color: #3f00ff;
    border-color: #3f00ff;
    border-bottom: 1px;
    border-style: solid;
    margin-top:3px;
    margin-bottom:0px;
}

#tray {
    border-color: #b0a8a8;
    border-bottom: 0px;
    border-style: solid;
    margin-top:3px;
    margin-bottom:2px;
}

#workspaces button.active {
	color: #93ffff;
    border-color: #93ffff;
    border-bottom: 1px;
    border-style: solid;
    margin-top:3px;
    margin-bottom:0px;
    transition: all 0.3s cubic-bezier(.55,-0.68,.48,1.682);
}

#workspaces button:hover {
    color: #3f00ff;
    border-color: #3f00ff;
    border-bottom: 1px;
    border-style: solid;
    margin-top:3px;
    margin-bottom:0px;
    background: rgba(161, 153, 157, 0.27);
}

#window,#custom-launcher,#custom-power,#custom-network_traffic,#custom-weather{
    padding: 0 3px;
    color: #fffe39;
    font-size: 24px;
    border-bottom: 2px;
    border-style: solid;
}
 
/* -----------------------------------------------------------------------------
 * Module styles
 * -------------------------------------------------------------------------- */

 
#clock {
	padding: 0 3px;
    color: #fffe39;
    font-size: 24px;
    border-bottom: 0px;
    border-style: solid;
}

#battery,#battery.charging,#cpu,#memory,#temperature,#temperature.critical,#custom-pacman,#disk,#pulseaudio,#pulseaudio.muted {
	padding: 0 3px;
	font-size: 24px;
	border-bottom: 2px;
	border-style: solid;
}

#battery {
	color: #648c11;
}

#battery.charging {
    color: #648c11;
}

@keyframes blink {
    to {
        color: #4c566a;
        background-color: #eceff4;
    }
}

#battery.critical:not(.charging) {
    background: #bf616a;
    color: #eceff4;
    animation-name: blink;
    animation-duration: 0.5s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-direction: alternate;
}

#cpu {
	color:#a3be8c ;
}

#memory {
	color: #d3869b;
}

#temperature {
	color: #8fbcbb;
}

#temperature.critical {
	color: #e30022;
}

#custom-pacman{
	color: #1cac78;
}

#disk{
	color: #ba55d3;
}

#network{
    padding: 0 3px;
    color: #85754e;
    font-size: 24px;
    border-bottom: 2px;
    border-style: solid;
}

#network.disabled {
    color:#bf616a;
}

#network.disconnected {
    color: #bf616a;
}

#network.speed {
	color: #fffe39;
    min-width: 25px;
    font-size: 24px;
    border: 0px;
    padding: 1 1 1 1;
}

#pulseaudio {
    color: #fffe39;
}

#pulseaudio.muted {
    color: #d3869b;
}

#tray {

}

#custom-power{
	padding: 0 3px;
	color: #e30022;
	font-size: 24px;
    border-bottom: 0px;
    border-style: solid;
}

#custom-lock_screen{
    padding: 0 3px;
    color: #ed872d;
    font-size: 24px;
    border-bottom: 0px;
    border-style: solid;   
}

#backlight {
    padding: 0 3px;
    color: #ebcb8b;
    font-size: 24px;
    border-bottom: 0px;
    border-style: solid;
}

#window{
    border-style: hidden;
    margin-top:1px;  
}    
#custom-keyboard-layout{
	padding: 0 3px;
    color: #d08770;
    font-size: 24px;
    border-bottom: 2px;
    border-style: solid;
}   
#custom-network_traffic{
   color:#d08770;
}



#pulseaudio {
	color: #c2b280;
}

#custom-launcher {
	padding: 0 3px;
	color: #c2b280;
	border-bottom: 2px;
	border-style: solid;
}

#custom-expand {
    min-width: 25px;
}

#tray {
    margin: 0;
    padding: 0;
}

#tray * {
    margin-left: 8px;
}

#group-minimized {
    border-left: solid;
    border-left-width: 0.5;
}

#custom-minimized {
	color: #ffa6a5;
}

#custom-system {
	color: #93ffff;
    min-width: 25px;
    font-size: 24px;
    margin: 0;
    padding: 0;
}

#custom-internet {
    min-width: 25px;
    font-size: 24px;
}

#custom-expand {
    min-width: 25px;
    font-size: 24px;
    color: #ff0800;
}

#custom-sw {
    min-width: 25px;
    font-size: 24px;
    color: #fffe39;
    margin: 1;
    padding: 1;
}

#custom-temp {
    min-width: 25px;
    font-size: 24px;
    color: #fe7a0b;
}

#custom-spacer {
    min-width: 10px;
    font-size: 24px;
    color: #ffffff;
    margin-top:5px;
}

#network.wireguard {
	padding: 0 3px;
	font-size: 24px;
	color: #3fff00;
	border-bottom: 0px;
	border-style: solid;
}

#network.wgsc {
	padding: 0 3px;
	font-size: 24px;
	color: #3fff00;
	border-bottom: 0px;
	border-style: solid;
}

#custom-kpntv {
    min-width: 35px;
    font-size: 24px;
}

#custom-firefox {
    min-width: 25px;
    font-size: 24px;
}

#custom-thunar {
    min-width: 25px;
    font-size: 24px;
}

#custom-geany {
    min-width: 25px;
    font-size: 24px;
}

#custom-deluge {
    min-width: 25px;
    font-size: 24px;
}

#custom-thunderbird {
    min-width: 25px;
    font-size: 24px;
}

#custom-spacer {
	color: #fdfbfc;
    min-width: 25px;
    font-size: 24px;
}

Leave a Reply

Your email address will not be published. Required fields are marked *