Wow, that looks really good, is this something that a novice can set up? I’m confused on how to do this.
1 Like
This seems to work very well, although I think the end color is a bit in your face. 
Not sure what it needs to calm down a bit, but the parameters aren’t there. (Brightness maybe.)
Anyway… Here is a python script by ChatGPT that takes a HEX color value and spits out the needed parameters.
def hex_to_rgb(hex_color):
# Convert hex to RGB
hex_color = hex_color.lstrip('#')
rgb = tuple(int(hex_color[i:i+2], 16) for i in (0, 2, 4))
return rgb
def process_color(hex_color):
# Convert hex to RGB
rgb = hex_to_rgb(hex_color)
# Subtract 128 from each value
rgb_minus_128 = tuple(value - 128 for value in rgb)
# Multiply each value by 0.00308593375
rgb_scaled = tuple(value * 0.00308593375 for value in rgb_minus_128)
return rgb_scaled
def main():
# Input hex color value
hex_color = input("Enter hex color value (e.g., #RRGGBB): ")
try:
# Process the color
result_rgb = process_color(hex_color)
# Output the result
print(f"Result: R = {result_rgb[0]:.2f}, G = {result_rgb[1]:.2f}, B = {result_rgb[2]:.2f}")
except ValueError:
print("Invalid hex color format. Please use the format #RRGGBB.")
if __name__ == "__main__":
main()
Needs to be run in a command prompt window.
3 Likes
My guess would be the Contrast setting 
.
Thank you, I see that now
Made a quick php version of the same thing myself.
<?php
$HEX = "808080";
$contrast = "1.30";
$HEXError = $contrastError = "";
if ($_SERVER["REQUEST_METHOD"] == "POST") {
if (empty($_POST["hex"])) {
$HEXError = "HEX is required";
}
else if(check_hex($_POST["hex"]) == 1){
$HEX = strtoupper(str_replace("#", "", $_POST["hex"]));
list($R, $G, $B) = sscanf("#".$HEX, "#%02x%02x%02x");
}
else{
$HEXError = "Input needs to be a RRGGBB value";
}
if(empty($_POST["contrast"])){
$contrastError = "Contrast is required";
}
else{
$contrast = number_format((float)floatval($_POST["contrast"]), 2, '.', '');
}
}
function check_hex($color) {
// If user accidentally passed along the # sign, strip it off
$color = ltrim($color, '#');
if(ctype_xdigit($color) && (strlen($color) == 6)){
return true;
}
else{
return false;
}
}
echo '<html>
<style>
body{
font-family: monospace;
font-size: 16px;
margin: 16px;
width: 410px;
height: 410px;
}
.hex, .contrast{
display: inline-block;
margin-top: 14px;
}
.hex input{
text-transform:uppercase;
}
.square{
border: 2px solid #000;
background: #'.$HEX.';
height: 72px;
width: 84px;
float: right;
margin-top: -40px;
}
.error {
color: #FF0000;
display: inline-block;
margin-top: 4px;
}
#submit{
margin-top: 24px;
width: 20%;
}
#submit:hover{
cursor: pointer;
}
</style>
<body>
<h2 id="title">HEX to koko-aio Color Converter</h2>
<form method="post" action="'.htmlspecialchars($_SERVER["PHP_SELF"]).'" autocomplete="off">';
if($HEX == "808080"){
echo 'BEZEL_R = "0.000000"<br>
BEZEL_G = "0.000000"<br>
BEZEL_B = "0.000000"<br>
BEZEL_CON = "'.$contrast.'0000"<br><br>';
}
else{
echo 'BEZEL_R = "'.($R - 128) * ((0.395 - ($contrast - 1.30) * (((3.75 - $contrast) * .125) + .00125)) / 128).'"<br>
BEZEL_G = "'.($G - 128) * ((0.395 - ($contrast - 1.30) * (((3.75 - $contrast) * .125) + .00125)) / 128).'"<br>
BEZEL_B = "'.($B - 128) * ((0.395 - ($contrast - 1.30) * (((3.75 - $contrast) * .125) + .00125)) / 128).'"<br>
BEZEL_CON = "'.$contrast.'0000"<br><br>';
}
echo '<div class="hex">HEX: # <input type="text" name="hex" value="'.$HEX.'"></div>
<div class="contrast">Contrast: <input type="text" name="contrast" value="'.$contrast.'"></div>
<div class="square"></div>
<span class="error">'.$HEXError.'</span>
<span class="error">'.$contrastError.'</span>
<br>
<br>
<input type="submit" name="submit" value="Convert" id="submit">
</form>
</body>
</html>';
?>
Edit: Fixed some of the code for those that want to use it.
Edit 2: Had to add some CSS.
1 Like
As a side question. I noticed that on my PC, when using the Duimon Mega Bezel versions of the shaders, if I drag the window size around to any size that is wider than 16:9, it just automatically expands the background image to fill the width of the screen. It’s kind of a nice relatively seamless way to fill the screen on these wider aspect ratios, without resorting to stretching or strange edge effects. Is there a way to do something similar in the settings within the Koko-aio shaders? I’ve looked through a lot of menus and tried to adjust things but it seems like the Koko shaders inherently limit the background to 16:9 at the widest, and beyond that it’s just black bars on the sides (unless you stretch it which I’m not going for). Not sure how complex it would be to get the background to automatically expand beyond 16:9 the way the Mega Bezel versions do (I don’t know enough about what goes on under the hood), but would be kind of cool to get that effect given that my phone is much wider than 16:9.
You can try the parameter named:
“Wrap mode: default, clamp to border, edge, repeat”
No stretching allowed tho, if that’s what you’re after.
Out of curiosity, what’s your phone what the resolution and how’s the performance? My s10 struggles very hard if not set with threaded rendering or 720p
1 Like
The top four images here show how the mega bezel version will just scale and expand and kind of a nice way no matter how wide I make the window. The bottom two images shows how it just kind of goes only up to a certain point in the Koko version and then just leaves black bars if you get any wider than 16:9. I feel like there may be something fancier and more complex going on here with the mega bezel version.
1 Like
Performance is very good on s22 ultra. I tried messing with those parameters last night and none really worked in the way I’m talking about with Mega Bezel. I’ll try to capture a photo of it.
1 Like
That is an understatement!! 
While it is not enabled by default, (The Mega Bezel also uses mirroring by default.) any image layer can be set to “Split Scale”. Meaning the layer is cut in half and each half can be moved to fill the space. In addition, the center area can be cloned with a portion preserved to allow layers to be stretched without distortion.
The Mega Bezel is a very complicated beast of a shader, with a lot of magical components.
All this comes at a performance cost, which is where koko-aio shines. It can run on hardware that cannot even load the Mega Bezel potato presets.
3 Likes
And me, naive, was thinking it implemented just some kind of dumb non uniform scaling.
Tsk!
@Brandon8o, sorry, but if you want wider bgs, in koko-aio, i fear you have to modify them via gimp/photoshop/* 
3 Likes
Not sure how to do that, but in theory would it serve as a low cost workaround to get a similar effect for wider aspect ratios?
I could probably figure out how to make my own wider background, but where would I put it in the file system to have it all work?
@Duimon found that the max decreases 0.02 every time Contrast increases .1 and vise versa. So I updated the equation to take that into consideration.
(RGB - 128) * ((0.395 - (Contrast - 1.30) * (((3.75 - Contrast) * .125) + .00125)) / 128)
Edit: Found that the equation didn’t work on the “extremes” i.e. 0.71 and 2.00, so I took at least 50 screenshots to fix it. I had 0.71, 1.40 and 2.00 exact values to divide by 128 and still took a few hours. This change shows I was wrong it wasn’t decreasing 0.02 it was decreasing 0.0125 every .1.
Explanation for those interested.
(RGB - 128) * ((Default Max Color - Distance from Default Contrast * (((Max Contrast- Contrast) * Distance to go .01 * 100) + Distance to go .01)) / 128)
I have tested with 0.71 as well which works fine with the change. For those wondering math was my best subject in school.
Edit 2: Figured out the Multiplication values where essentially the (Max Contrast - Contrast) * .01 Steps from Max Contrast * 100 + .00125 .
2 Likes
The pixel aspect on screen will be 1:1, so you can just make it wider the way you want.
As for where to put the file, it is defined in the preset you are using; so either you open the slangp file and read the location from there or find the image manually in your filesystem.
What preset are you using?
I went ahead and created a github page for the converter. If anybody runs into a problem with it then let me know.
https://hgoda90.github.io/HEX-koko-aio-Color-Converter/
Edit: Tweaked the equation some more.
if(contrast < 1){
$('#bezel-r').text((((hexToRgb(hex).r - 128) * (0.395 - (contrast - 1.30) * ((3.75 - contrast) * (contrast * .1 + .105) + (contrast * .01 + .0105))) / 128)).toFixed(10));
$('#bezel-g').text((((hexToRgb(hex).g - 128) * (0.395 - (contrast - 1.30) * ((3.75 - contrast) * (contrast * .1 + .105) + (contrast * .01 + .0105))) / 128)).toFixed(10));
$('#bezel-b').text((((hexToRgb(hex).b - 128) * (0.395 - (contrast - 1.30) * ((3.75 - contrast) * (contrast * .01 + .055) + (contrast * .001 + .0055))) / 128)).toFixed(10));
}
else{
$('#bezel-r').text((((hexToRgb(hex).r - 128) * (0.395 - (contrast - 1.30) * ((3.75 - contrast) * (contrast * .01 + .105) + (contrast * .001 + .0105))) / 128)).toFixed(10));
$('#bezel-g').text((((hexToRgb(hex).g - 128) * (0.395 - (contrast - 1.30) * ((3.75 - contrast) * (contrast * .01 + .105) + (contrast * .001 + .0105))) / 128)).toFixed(10));
$('#bezel-b').text((((hexToRgb(hex).b - 128) * (0.395 - (contrast - 1.30) * ((3.75 - contrast) * (contrast * .001 + .055) + (contrast * .0001 + .0055))) / 128)).toFixed(10));
}
Made a lot of changes to the Converter github page. I also found that the best settings for Contrast is between .7 and 2.1 before everything goes crazy.
2 Likes
I was using the SegaCD logo preset under Duimon additional presets. I opened it up and I see it references a graphics file, so I can go ahead and experiment with replacing that with a wider aspect background image to see what happens.
If I’m just doing my own background though, I suppose there would be no reason to have to use the Duimon version I was using, since I could probably just add a background to one of the regular Koko-aio bezels??
Another question I have concerns the ambilight presets. Is it possible to just swap a background image and have those still work? Or is it more complicated in terms of getting the lighting behavior to work a certain way with the image?
Yes, and yes to the other question too.
Also, extensive documentation is available in docs-ng.md text file.
I see. Would I replace background_over or background_under? I’m still a bit confused about the difference between these two
1 Like