Rofi is not truly transparent and instead kinda just murky on i3

[Sqooky]

I have been customizing a rofi to kinda match the sweet theme and got confused when trying to make it 100% transparent.
(image for context)

Is anyone aware of why my rofi isn’t truly transparent? I was unable to find any resources on whether or not there is a way to make it actually transparent.

The config file itself for those who want it iunno.

/**
 *
 * Original author : Aditya Shakya (adi1090x)
 * Original Github : @adi1090x
 * Modification made by Sqooky!

 * 
 * Rofi Theme File
 **/

/*****----- Configuration -----*****/
configuration {
	modi:                       "drun,run,filebrowser,window";
    show-icons:                 true;
    display-drun:               "";
    display-run:                "";
    display-filebrowser:        "";
    display-window:             "";
	drun-display-format:        "{name}";
	window-format:              "{w} · {c} · {t}";
}

/*****----- Global Properties -----*****/
* {
    font:                        "JetBrains Mono Nerd Font 10";
    background:                  #09164c00;
    background-alt:              #6f23a7;
    foreground:                  #FFFFFF;
    selected:                    #d80ac2;
    active:                      #3860FF;
    urgent:                      #BB00AF;
}

/*****----- Main Window -----*****/
window {
    /* properties for window widget */
    transparency:                "real";
    location:                    west;
    anchor:                      west;
    fullscreen:                  false;
    width:                       200px;
    height:                      50%;
    x-offset:                    0px;
    y-offset:                    0px;

    /* properties for all widgets */
    enabled:                     true;
    border-radius:               0px;
    cursor:                      "default";
    background-color:            @background;
}

/*****----- Main Box -----*****/
mainbox {
    enabled:                     true;
    spacing:                     0px;
    background-color:            transparent;
    orientation:                 vertical;
    children:                    [ "inputbar", "listbox", "mode-switcher" ];
}

listbox {
    spacing:                     15px;
    padding:                     15px;
    background-color:            transparent;
    orientation:                 vertical;
    children:                    [ "message", "listview" ];
}

/*****----- Inputbar -----*****/
inputbar {
    enabled:                     true;
    spacing:                     10px;
    padding:                     20px 20px 0px;
    background-color:            transparent;

    text-color:                  @foreground;
    orientation:                 horizontal;
    children:                    [ "textbox-prompt-colon", "entry" ];
}
textbox-prompt-colon {
    enabled:                     false;
    expand:                      false;
    str:                         "";
    padding:                     12px 15px;
    border-radius:               50px;
    background-color:            @background-alt;
    text-color:                  inherit;
}
entry {
    enabled:                     true;
    expand:                      true;
    padding:                     12px 16px;
    border-radius:               50px;
    background-color:            @background-alt;
    text-color:                  inherit;
    cursor:                      text;
    placeholder:                 "Search";
    placeholder-color:           inherit;
}
dummy {
    expand:                      true;
    background-color:            transparent;
}

/*****----- Mode Switcher -----*****/
mode-switcher{
    enabled:                     true;
    padding:                     2px;
    spacing:                     2px;
    background-color:            transparent;
    text-color:                  @foreground;
    border-radius:               0px;
}
button {
    padding:                     12px;
    border-radius:               20px;
    background-color:            @background-alt;
    text-color:                  inherit;
    cursor:                      pointer;
}
button selected {
    background-color:            @selected;
    text-color:                  @foreground;
}

/*****----- Listview -----*****/
listview {
    enabled:                     true;
    columns:                     1;
    lines:                       10;
    cycle:                       true;
    dynamic:                     true;
    scrollbar:                   false;
    layout:                      vertical;
    reverse:                     false;
    fixed-height:                true;
    fixed-columns:               true;
    
    spacing:                     1px;
    background-color:            transparent;
    text-color:                  @foreground;
    cursor:                      "default";
}

/*****----- Elements -----*****/
element {
    enabled:                     true;
    spacing:                     1px;
    padding:                     1px;
    border-radius:               5px;
    background-color:            transparent;
    text-color:                  @foreground;
    cursor:                      pointer;
}
element normal.normal {
    background-color:            inherit;
    text-color:                  inherit;
}
element normal.urgent {
    background-color:            @urgent;
    text-color:                  @foreground;
}
element normal.active {
    background-color:            @active;
    text-color:                  @foreground;
}
element selected.normal {
    background-color:            @selected;
    text-color:                  @foreground;
}
element selected.urgent {
    background-color:            @urgent;
    text-color:                  @foreground;
}
element selected.active {
    background-color:            @urgent;
    text-color:                  @foreground;
}
element-icon {
    background-color:            transparent;
    text-color:                  inherit;
    size:                        24px;
    cursor:                      inherit;
}
element-text {
    background-color:            transparent;
    text-color:                  inherit;
    cursor:                      inherit;
    vertical-align:              0.5;
    horizontal-align:            0.0;
}

/*****----- Message -----*****/
message {
    background-color:            transparent;
}
textbox {
    padding:                     12px;
    border-radius:               0px;
    background-color:            @background-alt;
    text-color:                  @foreground;
    vertical-align:              0.5;
    horizontal-align:            0.0;
}
error-message {
    padding:                     12px;
    border-radius:               0px;
    background-color:            @background;
    text-color:                  @foreground;
}

[soficshifts]

Try @transparent . No guarantees, just what I noticed in my configuration

E.g. from my rofi theme.

window {
    location: center;
    anchor:   center;
    transparency: "screenshot";
    padding: 10px;
    border:  0px;
    border-radius: 10px;
    color: @magenta;
    background-color: @transparent;
    spacing: 0;
    children:  [mainbox];
    orientation: horizontal;
}

[Sqooky]

The solution I found was to remove blurring entirely from picom for those who encounter this question
in the future.

The easiest way to do this is to go into your picom.conf and edit

  # requires: https://github.com/ibhagwan/picom
  method = "deez";
  #method = "kernel";
  strength = 0;
  # deviation = 1.0;
  # kernel = "11x11gaussian";
  background = false;
  background-frame = false;
  background-fixed = false;
  kern = "3x3box";
}

So that your method = “x” has an invalid value.