Skip to content

Rounded corners

elenapan edited this page Dec 13, 2024 · 1 revision

Rounded corners

AwesomeWM is capable of applying any shape to a window. The most commonly used shape is a rounded rectangle.

There is currently a superior way of rounding windows, by using a compositor, and particularly this fork of picom. I provide my personal picom configuration here.

The advantages are:

  • The corners are anti-aliased (they do not look jagged)
  • It works on any window manager

The disadvantages are:

  • You cannot (yet) have a separate corner radius for each of the 4 corners.

Personally, I use picom to round my window corners, and AwesomeWM's shaping method to apply shapes my widgets.

If you do not want to use a compositor for rounding window corners, you can re-enable window rounding through AwesomeWM inside the decoration theme you are using.

Simply add the following line inside ~/.config/awesome/decorations/themes/<your selected theme>.lua.

decorations.enable_rounding()

Anti-aliasing

Anti-aliasing can be applied to any wibox by making its background color transparent and putting all its items in a shaped container with the desired background color.

This trick makes it so the window shape is still considered a rectangle, but its corners are transparent. Keep in mind that a compositor is required to be running for the corner transparency to work.

Here is an example of how to make your own anti-aliased wibox.

-- Load these libraries (if you haven't already)
local awful = require("awful")
local gears = require("gears")
local wibox = require("wibox")

-- Create the box
local anti_aliased_wibox = wibox({visible = true, ontop = true, type = "normal", height = 100, width = 100})

-- Place it at the center of the screen
awful.placement.centered(anti_aliased_wibox)

-- Set transparent bg
anti_aliased_wibox.bg = "#00000000"

-- Put its items in a shaped container
anti_aliased_wibox:setup {
    -- Container
    {
        -- Items go here
        wibox.widget.textbox("Hello!"),
        -- ...
        layout = wibox.layout.fixed.vertical
    },
    -- The real background color
    bg = "#111111",
    -- The real, anti-aliased shape
    shape = gears.shape.rounded_rect,
    widget = wibox.container.background()
}
Clone this wiki locally