improved colors

app.py

@@ -86,12 +86,12 @@ with gr.Blocks(title="Semantic Segmentation Predictors") as demo:
                         with gr.Column(scale=1):
                             color_box0 = f"""<span style='display:inline-block; width:15px; height:15px; 
                                 background-color:rgb({legend[i][3][0]},{legend[i][3][1]},{legend[i][3][2]}); margin-left:6px; border:1px solid #000;'></span>"""
-                            gr.HTML(f"<b>{legend[i][1]}</b> → {legend[i][2]} {color_box0}")
+                            gr.HTML(f"<div style='display:flex; align-items:center; margin-bottom:2px;'><b>{legend[i][1]}</b> → {color_box0}</div>")
                         with gr.Column(scale=1):
                             if i + 1 < len(legend):
                                 color_box1 = f"""<span style='display:inline-block; width:15px; height:15px; 
                                     background-color:rgb({legend[i+1][3][0]},{legend[i+1][3][1]},{legend[i+1][3][2]}); margin-left:6px; border:1px solid #000;'></span>"""
-                                gr.HTML(f"<b>{legend[i+1][1]}</b> → {legend[i+1][2]} {color_box1}")
+                                gr.HTML(f"<div style='display:flex; align-items:center; margin-bottom:2px;'><b>{legend[i+1][1]}</b> → {color_box1}</div>")
                             else:
                                 gr.Markdown("")  # Keeps spacing consistent if list is odd
 

prova.html

@@ -1,3 +0,0 @@
-<span style='display:inline-block; width:15px; height:15px;
-                             background-color:rgb(255,0,0); margin-left:6px;
-                             border:1px solid #000;'></span>