diff --git a/modules/core_styles/styles/progressbars.otui b/modules/core_styles/styles/progressbars.otui
index 889b3591..82e2e589 100644
--- a/modules/core_styles/styles/progressbars.otui
+++ b/modules/core_styles/styles/progressbars.otui
@@ -4,3 +4,7 @@ ProgressBar < UIProgressBar
   border: 1 black
   image-source: /core_styles/styles/images/progressbar.png
   image-border: 1
+
+ProgressRect < UIProgressRect
+  anchors.fill: parent
+  background-color: #00000044
diff --git a/src/framework/graphics/coordsbuffer.h b/src/framework/graphics/coordsbuffer.h
index 72940ca1..0b453ae4 100644
--- a/src/framework/graphics/coordsbuffer.h
+++ b/src/framework/graphics/coordsbuffer.h
@@ -41,6 +41,10 @@ public:
         m_hardwareCached = false;
     }
 
+    void addTriangle(const Point& a, const Point& b, const Point& c) {
+        m_vertexArray.addTriangle(a, b, c);
+        m_hardwareCached = false;
+    }
     void addRect(const Rect& dest) {
         m_vertexArray.addRect(dest);
         m_hardwareCached = false;
diff --git a/src/framework/graphics/painter.h b/src/framework/graphics/painter.h
index 716163f7..01eeecee 100644
--- a/src/framework/graphics/painter.h
+++ b/src/framework/graphics/painter.h
@@ -76,6 +76,7 @@ public:
     void drawTexturedRect(const Rect& dest, const TexturePtr& texture) { drawTexturedRect(dest, texture, Rect(Point(0,0), texture->getSize())); }
     virtual void drawRepeatedTexturedRect(const Rect& dest, const TexturePtr& texture, const Rect& src) = 0;
     virtual void drawFilledRect(const Rect& dest) = 0;
+    virtual void drawFilledTriangle(const Point& a, const Point& b, const Point& c) = 0;
     virtual void drawBoundingRect(const Rect& dest, int innerLineWidth = 1) = 0;
 
     virtual void setProjectionMatrix(const Matrix3& projectionMatrix) { m_projectionMatrix = projectionMatrix; }
diff --git a/src/framework/graphics/painterogl1.cpp b/src/framework/graphics/painterogl1.cpp
index d20e0e11..82bae7fd 100644
--- a/src/framework/graphics/painterogl1.cpp
+++ b/src/framework/graphics/painterogl1.cpp
@@ -167,6 +167,18 @@ void PainterOGL1::drawFilledRect(const Rect& dest)
     drawCoords(m_coordsBuffer);
 }
 
+void PainterOGL1::drawFilledTriangle(const Point& a, const Point& b, const Point& c)
+{
+    if(a == b || a == c || b == c)
+        return;
+
+    setTexture(nullptr);
+
+    m_coordsBuffer.clear();
+    m_coordsBuffer.addTriangle(a, b, c);
+    drawCoords(m_coordsBuffer);
+}
+
 void PainterOGL1::drawBoundingRect(const Rect& dest, int innerLineWidth)
 {
     if(dest.isEmpty() || innerLineWidth == 0)
diff --git a/src/framework/graphics/painterogl1.h b/src/framework/graphics/painterogl1.h
index e083670c..1db679dc 100644
--- a/src/framework/graphics/painterogl1.h
+++ b/src/framework/graphics/painterogl1.h
@@ -53,6 +53,7 @@ public:
     void drawTexturedRect(const Rect& dest, const TexturePtr& texture, const Rect& src);
     void drawRepeatedTexturedRect(const Rect& dest, const TexturePtr& texture, const Rect& src);
     void drawFilledRect(const Rect& dest);
+    void drawFilledTriangle(const Point& a, const Point& b, const Point& c);
     void drawBoundingRect(const Rect& dest, int innerLineWidth);
 
     void setMatrixMode(MatrixMode matrixMode);
diff --git a/src/framework/graphics/painterogl2.cpp b/src/framework/graphics/painterogl2.cpp
index d9140de9..bee48f95 100644
--- a/src/framework/graphics/painterogl2.cpp
+++ b/src/framework/graphics/painterogl2.cpp
@@ -150,6 +150,18 @@ void PainterOGL2::drawFilledRect(const Rect& dest)
     drawCoords(m_coordsBuffer);
 }
 
+void PainterOGL2::drawFilledTriangle(const Point& a, const Point& b, const Point& c)
+{
+    if(a == b || a == c || b == c)
+        return;
+
+    setDrawProgram(m_shaderProgram ? m_shaderProgram : g_shaders.getDrawSolidColorProgram().get());
+
+    m_coordsBuffer.clear();
+    m_coordsBuffer.addTriangle(a, b, c);
+    drawCoords(m_coordsBuffer);
+}
+
 void PainterOGL2::drawBoundingRect(const Rect& dest, int innerLineWidth)
 {
     if(dest.isEmpty() || innerLineWidth == 0)
diff --git a/src/framework/graphics/painterogl2.h b/src/framework/graphics/painterogl2.h
index bee963dd..3e3bfd68 100644
--- a/src/framework/graphics/painterogl2.h
+++ b/src/framework/graphics/painterogl2.h
@@ -46,6 +46,7 @@ public:
     void drawTexturedRect(const Rect& dest, const TexturePtr& texture, const Rect& src);
     void drawRepeatedTexturedRect(const Rect& dest, const TexturePtr& texture, const Rect& src);
     void drawFilledRect(const Rect& dest);
+    void drawFilledTriangle(const Point& a, const Point& b, const Point& c);
     void drawBoundingRect(const Rect& dest, int innerLineWidth = 1);
 
     void setDrawProgram(PainterShaderProgram *drawProgram) { m_drawProgram = drawProgram; }
diff --git a/src/framework/graphics/vertexarray.h b/src/framework/graphics/vertexarray.h
index 188dbb7d..12ea87f7 100644
--- a/src/framework/graphics/vertexarray.h
+++ b/src/framework/graphics/vertexarray.h
@@ -30,6 +30,11 @@ class VertexArray
 {
 public:
     inline void addVertex(float x, float y) { m_buffer << x << y; }
+    inline void addTriangle(const Point& a, const Point& b, const Point& c) {
+        addVertex(a.x, a.y);
+        addVertex(b.x, b.y);
+        addVertex(c.x, c.y);
+    }
     inline void addRect(const Rect& rect) {
         float top = rect.top();
         float right = rect.right()+1;
diff --git a/src/framework/util/rect.h b/src/framework/util/rect.h
index 111a6c31..22bcba9a 100644
--- a/src/framework/util/rect.h
+++ b/src/framework/util/rect.h
@@ -60,6 +60,10 @@ public:
     TPoint<T> bottomRight() const { return TPoint<T>(x2, y2); }
     TPoint<T> topRight() const { return TPoint<T>(x2, y1); }
     TPoint<T> bottomLeft() const { return TPoint<T>(x1, y2); }
+    TPoint<T> topCenter() const { return TPoint<T>((x1+x2)/2, y1); }
+    TPoint<T> bottomCenter() const { return TPoint<T>((x1+x2)/2, y2); }
+    TPoint<T> centerLeft() const { return TPoint<T>(x1, (y1+y2)/2); }
+    TPoint<T> centerRight() const { return TPoint<T>(x2, (y1+y2)/2); }
     TPoint<T> center() const { return TPoint<T>((x1+x2)/2, (y1+y2)/2); }
     T width() const { return  x2 - x1 + 1; }
     T height() const { return  y2 - y1 + 1; }
diff --git a/src/otclient/CMakeLists.txt b/src/otclient/CMakeLists.txt
index 63de03fb..18bde170 100644
--- a/src/otclient/CMakeLists.txt
+++ b/src/otclient/CMakeLists.txt
@@ -55,6 +55,7 @@ SET(otclient_SOURCES ${otclient_SOURCES}
     ${CMAKE_CURRENT_LIST_DIR}/ui/uiitem.cpp
     ${CMAKE_CURRENT_LIST_DIR}/ui/uicreature.cpp
     ${CMAKE_CURRENT_LIST_DIR}/ui/uimap.cpp
+    ${CMAKE_CURRENT_LIST_DIR}/ui/uiprogressrect.cpp
 
     # otclient net
     ${CMAKE_CURRENT_LIST_DIR}/net/protocolgame.cpp
diff --git a/src/otclient/luafunctions.cpp b/src/otclient/luafunctions.cpp
index 8eb09635..94bf3188 100644
--- a/src/otclient/luafunctions.cpp
+++ b/src/otclient/luafunctions.cpp
@@ -41,6 +41,7 @@
 #include <otclient/ui/uiitem.h>
 #include <otclient/ui/uicreature.h>
 #include <otclient/ui/uimap.h>
+#include <otclient/ui/uiprogressrect.h>
 #include <otclient/core/outfit.h>
 
 void OTClient::registerLuaFunctions()
@@ -389,4 +390,9 @@ void OTClient::registerLuaFunctions()
     g_lua.bindClassMemberFunction<UIMap>("getMaxZoomIn", &UIMap::getMaxZoomIn);
     g_lua.bindClassMemberFunction<UIMap>("getMaxZoomOut", &UIMap::getMaxZoomOut);
     g_lua.bindClassMemberFunction<UIMap>("getZoom", &UIMap::getZoom);
+
+    g_lua.registerClass<UIProgressRect, UIWidget>();
+    g_lua.bindClassStaticFunction<UIProgressRect>("create", []{ return UIProgressRectPtr(new UIProgressRect); } );
+    g_lua.bindClassMemberFunction<UIProgressRect>("setPercent", &UIProgressRect::setPercent);
+    g_lua.bindClassMemberFunction<UIProgressRect>("getPercent", &UIProgressRect::getPercent);
 }
diff --git a/src/otclient/ui/declarations.h b/src/otclient/ui/declarations.h
index 9c2a3cd4..342fb9b7 100644
--- a/src/otclient/ui/declarations.h
+++ b/src/otclient/ui/declarations.h
@@ -29,11 +29,11 @@
 class UIItem;
 class UICreature;
 class UIMap;
-class UIGame;
+class UIProgressRect;
 
 typedef std::shared_ptr<UIItem> UIItemPtr;
 typedef std::shared_ptr<UICreature> UICreaturePtr;
 typedef std::shared_ptr<UIMap> UIMapPtr;
-typedef std::shared_ptr<UIGame> UIGamePtr;
+typedef std::shared_ptr<UIProgressRect> UIProgressRectPtr;
 
 #endif
diff --git a/src/otclient/ui/uiprogressrect.cpp b/src/otclient/ui/uiprogressrect.cpp
new file mode 100644
index 00000000..459cb012
--- /dev/null
+++ b/src/otclient/ui/uiprogressrect.cpp
@@ -0,0 +1,93 @@
+/*
+ * Copyright (c) 2010-2012 OTClient <https://github.com/edubart/otclient>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+#include "uiprogressrect.h"
+#include <framework/otml/otml.h>
+#include <framework/graphics/graphics.h>
+#include <framework/graphics/fontmanager.h>
+
+UIProgressRect::UIProgressRect()
+{
+    m_percent = 0;
+}
+
+void UIProgressRect::drawSelf(Fw::DrawPane drawPane)
+{
+    if((drawPane & Fw::ForegroundPane) == 0)
+        return;
+
+    g_painter->setColor(m_backgroundColor);
+
+    // todo: check +1 to right/bottom
+    // todo: add smooth
+    Rect drawRect = getPaddingRect();
+
+    // 0% - 12.5% (12.5)
+    // triangle from top center, to top right (var x)
+    if(m_percent < 12.5) {
+        Point var = Point(std::max(m_percent - 0.0, 0.0) * (drawRect.right() - drawRect.horizontalCenter()) / 12.5, 0);
+        g_painter->drawFilledTriangle(drawRect.center(), drawRect.topRight() + Point(1,0), drawRect.topCenter() + var);
+    }
+
+    // 12.5% - 37.5% (25)
+    // triangle from top right to bottom right (var y)
+    if(m_percent < 37.5) {
+        Point var = Point(0, std::max(m_percent - 12.5, 0.0) * (drawRect.bottom() - drawRect.top()) / 25.0);
+        g_painter->drawFilledTriangle(drawRect.center(), drawRect.bottomRight() + Point(1,1), drawRect.topRight() + var + Point(1,0));
+    }
+
+    // 37.5% - 62.5% (25)
+    // triangle from bottom right to bottom left (var x)
+    if(m_percent < 62.5) {
+        Point var = Point(std::max(m_percent - 37.5, 0.0) * (drawRect.right() - drawRect.left()) / 25.0, 0);
+        g_painter->drawFilledTriangle(drawRect.center(), drawRect.bottomLeft() + Point(0,1), drawRect.bottomRight() - var + Point(1,1));
+    }
+
+    // 62.5% - 87.5% (25)
+    // triangle from bottom left to top left
+    if(m_percent < 87.5) {
+        Point var = Point(0, std::max(m_percent - 62.5, 0.0) * (drawRect.bottom() - drawRect.top()) / 25.0);
+        g_painter->drawFilledTriangle(drawRect.center(), drawRect.topLeft(), drawRect.bottomLeft() - var + Point(0,1));
+    }
+
+    // 87.5% - 100% (12.5)
+    // triangle from top left to top center
+    if(m_percent < 100) {
+        Point var = Point(std::max(m_percent - 87.5, 0.0) * (drawRect.horizontalCenter() - drawRect.left()) / 12.5, 0);
+        g_painter->drawFilledTriangle(drawRect.center(), drawRect.topCenter(), drawRect.topLeft() + var);
+    }
+}
+
+void UIProgressRect::setPercent(float percent)
+{
+    m_percent = std::max(std::min((double)percent, 100.0), 0.0);
+}
+
+void UIProgressRect::onStyleApply(const std::string& styleName, const OTMLNodePtr& styleNode)
+{
+    UIWidget::onStyleApply(styleName, styleNode);
+
+    for(const OTMLNodePtr& node : styleNode->children()) {
+        if(node->tag() == "percent")
+            setPercent(node->value<float>());
+    }
+}
diff --git a/src/otclient/ui/uiprogressrect.h b/src/otclient/ui/uiprogressrect.h
new file mode 100644
index 00000000..91c6615c
--- /dev/null
+++ b/src/otclient/ui/uiprogressrect.h
@@ -0,0 +1,45 @@
+/*
+ * Copyright (c) 2010-2012 OTClient <https://github.com/edubart/otclient>
+ *
+ * Permission is hereby granted, free of charge, to any person obtaining a copy
+ * of this software and associated documentation files (the "Software"), to deal
+ * in the Software without restriction, including without limitation the rights
+ * to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+ * copies of the Software, and to permit persons to whom the Software is
+ * furnished to do so, subject to the following conditions:
+ *
+ * The above copyright notice and this permission notice shall be included in
+ * all copies or substantial portions of the Software.
+ *
+ * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+ * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+ * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+ * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+ * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+ * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
+ * THE SOFTWARE.
+ */
+
+#ifndef UIPROGRESSRECT_H
+#define UIPROGRESSRECT_H
+
+#include "declarations.h"
+#include <framework/ui/uiwidget.h>
+#include <otclient/core/item.h>
+
+class UIProgressRect : public UIWidget
+{
+public:
+    UIProgressRect();
+    void drawSelf(Fw::DrawPane drawPane);
+
+    void setPercent(float percent);
+    float getPercent() { return m_percent; }
+
+protected:
+    void onStyleApply(const std::string& styleName, const OTMLNodePtr& styleNode);
+
+    float m_percent;
+};
+
+#endif