diff --git a/Arona/src/widget/misc/w_volume_bar.cpp b/Arona/src/widget/misc/w_volume_bar.cpp
index bef3ddd..e29ef5b 100644
--- a/Arona/src/widget/misc/w_volume_bar.cpp
+++ b/Arona/src/widget/misc/w_volume_bar.cpp
@@ -1,7 +1,6 @@
 #include "w_volume_bar.h"
 
 #include "arona_application.h"
-#include "tool/math/lerp.h"
 
 w_volume_bar::w_volume_bar(bool vertical) : is_vertical(vertical)
 {
@@ -11,8 +10,9 @@ w_volume_bar::w_volume_bar(bool vertical) : is_vertical(vertical)
 }
 
 void w_volume_bar::on_draw(const Cairo::RefPtr<Cairo::Context>& cr, int width, int height) {
-    // Draw a black rectangle.
+    // Draw background color
     cr->set_source_rgba(0.0, 0.0, 0.0, 1.0);
+    cr->rectangle(0, 0, width, height);
     cr->fill();
 
     Cairo::RefPtr<Cairo::LinearGradient> line_color;
@@ -21,9 +21,10 @@ void w_volume_bar::on_draw(const Cairo::RefPtr<Cairo::Context>& cr, int width, i
     } else {
         line_color = Cairo::LinearGradient::create(0, 0, width, 0);
     }
-    line_color->add_color_stop_rgb(0, 0.0, 1.0, 0.0);
-    line_color->add_color_stop_rgb(0.7, 0.5, 0.5, 0.0); // (0.5, 0.5, 0.5)
-    line_color->add_color_stop_rgb(1, 1.0, 0.0, 0.0);
+    line_color->add_color_stop_rgb(0, 1.0, 0.0, 0.0);
+    line_color->add_color_stop_rgb(0.2, 1.0, 0.0, 0.0);
+    line_color->add_color_stop_rgb(0.4, 0.5, 0.5, 0.0); // (0.5, 0.5, 0.5)
+    line_color->add_color_stop_rgb(1, 0.0, 1.0, 0.0);
     cr->set_source(line_color);
 
     // draw value bar
@@ -34,5 +35,13 @@ void w_volume_bar::on_draw(const Cairo::RefPtr<Cairo::Context>& cr, int width, i
     }
     cr->fill();
 
+    // draw border
+    cr->set_source_rgba(1.0, 1.0, 1.0, 1.0);
+    cr->set_line_width(1.0);
+    cr->line_to(0, 0);
+    cr->line_to(width, 0);
+    cr->line_to(width, height);
+    cr->line_to(0, height);
+    cr->line_to(0, 0);
     cr->stroke();
 }