diff --git a/examples/iot-dashboard/IndoorTemperature.cpp b/examples/iot-dashboard/IndoorTemperature.cpp
new file mode 100644
index 00000000..4b99b0cb
--- /dev/null
+++ b/examples/iot-dashboard/IndoorTemperature.cpp
@@ -0,0 +1,55 @@
+#include "IndoorTemperature.h"
+#include "DaytimeSkin.h"
+#include "RoundedIcon.h"
+
+#include <QskBoxShapeMetrics.h>
+#include <QskGraphic.h>
+#include <QskGraphicLabel.h>
+#include <QskPushButton.h>
+#include <QskTextLabel.h>
+
+#include <QImage>
+
+IndoorTemperature::IndoorTemperature(QQuickItem *parent)
+    : QskLinearBox(Qt::Horizontal, parent)
+{
+    setMargins(17);
+    setSpacing(20);
+
+    QskGradient gradient(QskGradient::Vertical, "#ff7d34", "#ff3122");
+    auto* icon = new RoundedIcon("indoor-temperature", gradient, this);
+
+    auto *titleAndValue = new QskLinearBox(Qt::Vertical, this);
+
+    auto* title = new QskTextLabel("Indoor Temperature", titleAndValue);
+    title->setFontRole(DaytimeSkin::TitleFont);
+
+    auto* value = new QskTextLabel("+24", titleAndValue);
+    value->setFontRole(QskSkin::HugeFont);
+    value->setTextColor("#929CB2");
+
+    auto* buttons = new QskLinearBox(Qt::Vertical, this);
+    buttons->setSpacing(0);
+
+    QImage upImage( ":/images/up.png");
+    auto upGraphic = QskGraphic::fromImage( upImage );
+    upGraphic.setDefaultSize({10, 5.71});
+    auto* upButton = new QskPushButton(buttons);
+    upButton->setBoxShapeHint(QskPushButton::Panel, {30, 30, 0, 0});
+    upButton->setSizePolicy(QskSizePolicy::Fixed, QskSizePolicy::Expanding);
+    upButton->setFixedWidth(32);
+    upButton->setGradientHint(QskPushButton::Panel, {"#f7f7f7"});
+    upButton->setGraphic(upGraphic);
+    upButton->setGraphicSourceSize({10, 5.71});
+
+    QImage downImage( ":/images/down.png");
+    auto downGraphic = QskGraphic::fromImage( downImage );
+    downGraphic.setDefaultSize({10, 5.71});
+    auto* downButton = new QskPushButton(buttons);
+    downButton->setBoxShapeHint(QskPushButton::Panel, {0, 0, 30, 30});
+    downButton->setSizePolicy(QskSizePolicy::Fixed, QskSizePolicy::Expanding);
+    downButton->setFixedWidth(32);
+    downButton->setGradientHint(QskPushButton::Panel, {"#f7f7f7"});
+    downButton->setGraphic(downGraphic);
+    downButton->setGraphicSourceSize({10, 5.71});
+}
diff --git a/examples/iot-dashboard/IndoorTemperature.h b/examples/iot-dashboard/IndoorTemperature.h
new file mode 100644
index 00000000..8cdfd976
--- /dev/null
+++ b/examples/iot-dashboard/IndoorTemperature.h
@@ -0,0 +1,12 @@
+#ifndef INDOORTEMPERATURE_H
+#define INDOORTEMPERATURE_H
+
+#include <QskLinearBox.h>
+
+class IndoorTemperature : public QskLinearBox
+{
+public:
+    IndoorTemperature( QQuickItem* parent );
+};
+
+#endif // INDOORTEMPERATURE_H
diff --git a/examples/iot-dashboard/MainContent.cpp b/examples/iot-dashboard/MainContent.cpp
index 6935c70a..d0cede61 100644
--- a/examples/iot-dashboard/MainContent.cpp
+++ b/examples/iot-dashboard/MainContent.cpp
@@ -1,6 +1,7 @@
 #include "MainContent.h"
 
 #include "Card.h"
+#include "IndoorTemperature.h"
 #include "PieChart.h"
 #include "TopBar.h"
 #include "Usage.h"
@@ -20,16 +21,19 @@ MainContent::MainContent( QQuickItem *parent ) : QskLinearBox( Qt::Vertical, par
     auto* topBar = new TopBar(this);
 
     auto* gridBox = new QskGridBox(this);
-    gridBox->setMargins({15, 0, 15, 0});
+    gridBox->setMargins({15, 0, 15, 20});
     gridBox->setPanel(true);
-    gridBox->setBoxShapeHint(QskBox::Panel, QskBoxShapeMetrics(6) );
-    gridBox->setBoxBorderMetricsHint( QskBox::Panel, QskBoxBorderMetrics(2) );
+    gridBox->setBoxShapeHint(QskBox::Panel, 6 );
+    gridBox->setBoxBorderMetricsHint( QskBox::Panel, 2 );
     QskBoxBorderColors borderColors("#dddddd");
     borderColors.setAlpha(100);
     gridBox->setBoxBorderColorsHint( QskBox::Panel, borderColors);
 
     auto* usage = new Usage(gridBox);
     gridBox->addItem(usage, 0, 0, 2, 1);
+
+    auto* indoorTemperature = new IndoorTemperature(gridBox);
+    gridBox->addItem(indoorTemperature, 0, 1);
 }
 
 void MainContent::addCard( const QString &title, QskControl *content, int column )
diff --git a/examples/iot-dashboard/PieChartPainted.cpp b/examples/iot-dashboard/PieChartPainted.cpp
index 090615bc..1c4cc61f 100644
--- a/examples/iot-dashboard/PieChartPainted.cpp
+++ b/examples/iot-dashboard/PieChartPainted.cpp
@@ -23,10 +23,8 @@ PieChartPainted::PieChartPainted(const QColor& color, const QGradient& gradient,
     m_progressLabel->setTextColor(color);
 }
 
-QSizeF PieChartPainted::contentsSizeHint(Qt::SizeHint sizeHint, const QSizeF& size) const
+QSizeF PieChartPainted::contentsSizeHint(Qt::SizeHint /*sizeHint*/, const QSizeF& /*size*/) const
 {
-    qDebug() << Q_FUNC_INFO << sizeHint << size << layoutRect() << contentsRect();
-//    return size;
     return {57, 57};
 }
 
diff --git a/examples/iot-dashboard/RoundedIcon.cpp b/examples/iot-dashboard/RoundedIcon.cpp
new file mode 100644
index 00000000..fafc0108
--- /dev/null
+++ b/examples/iot-dashboard/RoundedIcon.cpp
@@ -0,0 +1,29 @@
+#include "RoundedIcon.h"
+
+#include <QskBoxShapeMetrics.h>
+#include <QskGraphic.h>
+#include <QskGraphicLabel.h>
+
+#include <QImage>
+
+RoundedIcon::RoundedIcon(const QString& iconName, const QskGradient& gradient, QQuickItem* parent)
+    : QskBox(parent)
+    , m_iconName(iconName)
+    , m_gradient(gradient)
+{
+    setPanel(true);
+    setPolishOnResize( true );
+    setGradientHint(Panel, gradient);
+    setBoxShapeHint(Panel, 6 );
+
+    QString fileName = ":/images/" + iconName + ".png";
+    QImage image( fileName );
+    auto graphic = QskGraphic::fromImage( image );
+    m_graphicLabel = new QskGraphicLabel( graphic, this );
+}
+
+void RoundedIcon::updateLayout()
+{
+    m_graphicLabel->setSize( {36, 36});
+    m_graphicLabel->setPosition( { ( width() - m_graphicLabel->width() ) / 2, ( height() - m_graphicLabel->height() ) / 2 } );
+}
diff --git a/examples/iot-dashboard/RoundedIcon.h b/examples/iot-dashboard/RoundedIcon.h
new file mode 100644
index 00000000..7e37eb0b
--- /dev/null
+++ b/examples/iot-dashboard/RoundedIcon.h
@@ -0,0 +1,25 @@
+#ifndef ROUNDEDICON_H
+#define ROUNDEDICON_H
+
+#include <QskBox.h>
+#include <QskGradient.h>
+
+class QskGraphicLabel;
+
+class RoundedIcon : public QskBox
+{
+    Q_OBJECT
+
+public:
+    RoundedIcon(const QString& iconName, const QskGradient& gradient, QQuickItem *parent = nullptr);
+
+protected:
+    void updateLayout() override;
+
+private:
+    QString m_iconName;
+    QskGradient m_gradient;
+    QskGraphicLabel* m_graphicLabel;
+};
+
+#endif // ROUNDEDICON_H
diff --git a/examples/iot-dashboard/Usage.cpp b/examples/iot-dashboard/Usage.cpp
index c4617ea9..f9413af5 100644
--- a/examples/iot-dashboard/Usage.cpp
+++ b/examples/iot-dashboard/Usage.cpp
@@ -7,6 +7,7 @@ Usage::Usage(QQuickItem *parent)
     : QskLinearBox(Qt::Vertical, parent)
 {
     setMargins(17);
+
     auto* title = new QskTextLabel("Usage", this);
     title->setFontRole(DaytimeSkin::TitleFont);
 
diff --git a/examples/iot-dashboard/images.qrc b/examples/iot-dashboard/images.qrc
index 7543c5e6..b0f697a4 100644
--- a/examples/iot-dashboard/images.qrc
+++ b/examples/iot-dashboard/images.qrc
@@ -8,5 +8,8 @@
         <file>images/storage.png</file>
         <file>images/members.png</file>
         <file>images/logout.png</file>
+        <file>images/indoor-temperature.png</file>
+        <file>images/up.png</file>
+        <file>images/down.png</file>
     </qresource>
 </RCC>
diff --git a/examples/iot-dashboard/images/down.png b/examples/iot-dashboard/images/down.png
new file mode 100644
index 00000000..8c321ad1
Binary files /dev/null and b/examples/iot-dashboard/images/down.png differ
diff --git a/examples/iot-dashboard/images/down.svg b/examples/iot-dashboard/images/down.svg
new file mode 100644
index 00000000..79693610
--- /dev/null
+++ b/examples/iot-dashboard/images/down.svg
@@ -0,0 +1,3 @@
+<svg width="10" height="6" viewBox="0 0 10 6" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.00007 3.8017L8.8891 0.0689508C8.98509 -0.0248144 9.1436 -0.022582 9.24183 0.0734158L9.92498 0.740935C10.0232 0.836933 10.0254 0.993209 9.92944 1.08697L5.1809 5.64575C5.13179 5.69487 5.06481 5.71719 5.00007 5.71273C4.93309 5.71496 4.86835 5.69264 4.81924 5.64575L0.0706933 1.08697C-0.0253045 0.993209 -0.0230719 0.836933 0.0751584 0.740935L0.758305 0.0734158C0.856536 -0.022582 1.01504 -0.0248144 1.11104 0.0689508L5.00007 3.8017Z" fill="#929CB2"/>
+</svg>
diff --git a/examples/iot-dashboard/images/indoor-temperature.png b/examples/iot-dashboard/images/indoor-temperature.png
new file mode 100644
index 00000000..1823aade
Binary files /dev/null and b/examples/iot-dashboard/images/indoor-temperature.png differ
diff --git a/examples/iot-dashboard/images/indoor-temperature.svg b/examples/iot-dashboard/images/indoor-temperature.svg
new file mode 100644
index 00000000..cbad53ff
--- /dev/null
+++ b/examples/iot-dashboard/images/indoor-temperature.svg
@@ -0,0 +1,11 @@
+<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0)">
+<path d="M19.7588 24.262V5.69005C19.7588 5.53433 19.6967 5.38498 19.5864 5.27498C19.4828 5.15634 19.3296 5.09295 19.1725 5.1038L16.8275 5.11142C16.5037 5.11142 16.2412 5.37391 16.2412 5.69767V24.2614C14.1929 25.2315 13.3188 27.6785 14.2889 29.7268C14.8339 30.8777 15.8825 31.7104 17.1271 31.9806C17.4122 32.0404 17.7028 32.0708 17.9941 32.0715C20.2606 32.0723 22.0986 30.2356 22.0994 27.9692C22.1 26.3853 21.189 24.9425 19.7588 24.262ZM20.7643 28.9431C20.5841 29.4529 20.2664 29.9028 19.8462 30.243V30.2418C19.1514 30.8035 18.2396 31.0203 17.3663 30.8316C15.7859 30.4811 14.7887 28.9157 15.1392 27.3352C15.3578 26.3494 16.0684 25.5455 17.0199 25.2076C17.2552 25.1259 17.4132 24.9045 17.4138 24.6554V6.28217L18.5863 6.27631V24.6554C18.5864 24.9048 18.7443 25.1267 18.9797 25.2088C20.5037 25.7472 21.3027 27.4191 20.7643 28.9431Z" fill="white"/>
+<path d="M24.4222 23.8602C23.8268 22.9284 23.0357 22.1373 22.1038 21.5418V18.0014H23.8626C24.1864 18.0014 24.4489 17.7389 24.4489 17.4152C24.4489 17.0914 24.1864 16.8289 23.8626 16.8289H22.1038V15.6564H23.8626C24.1864 15.6564 24.4489 15.3939 24.4489 15.0701C24.4489 14.7464 24.1864 14.4839 23.8626 14.4839H22.1038V13.3114H23.8626C24.1864 13.3114 24.4489 13.0489 24.4489 12.7251C24.4489 12.4014 24.1864 12.1389 23.8626 12.1389H22.1038V10.9664H23.8626C24.1864 10.9664 24.4489 10.7039 24.4489 10.3801C24.4489 10.0563 24.1864 9.79384 23.8626 9.79384H22.1038V8.62133H23.8626C24.1864 8.62133 24.4489 8.35884 24.4489 8.03508C24.4489 7.71132 24.1864 7.44882 23.8626 7.44882H22.1038V4.51754C22.1013 2.25218 20.2654 0.416322 18 0.413757C15.7347 0.416322 13.8988 2.25218 13.8963 4.51754V21.5418C10.3494 23.8083 9.31144 28.5209 11.5779 32.0677C13.8444 35.6146 18.557 36.6525 22.1038 34.3861C25.6507 32.1195 26.6886 27.4069 24.4222 23.8602ZM18 34.4166C14.4385 34.4209 11.5477 31.5372 11.5434 27.9756C11.5406 25.6656 12.7735 23.5305 14.7756 22.3784C14.957 22.2737 15.0688 22.0801 15.0688 21.8707V4.51754C15.0707 2.89948 16.382 1.58817 18 1.58627C19.6177 1.5892 20.9284 2.89985 20.9313 4.51754V21.8707C20.9313 22.0801 21.0431 22.2737 21.2244 22.3784C24.3114 24.1548 25.3737 28.0974 23.5972 31.1843C22.4451 33.1865 20.31 34.4193 18 34.4166Z" fill="white"/>
+</g>
+<defs>
+<clipPath id="clip0">
+<rect width="35.1724" height="35.1724" fill="white" transform="translate(0.413818 0.413757)"/>
+</clipPath>
+</defs>
+</svg>
diff --git a/examples/iot-dashboard/images/up.png b/examples/iot-dashboard/images/up.png
new file mode 100644
index 00000000..aff671ba
Binary files /dev/null and b/examples/iot-dashboard/images/up.png differ
diff --git a/examples/iot-dashboard/images/up.svg b/examples/iot-dashboard/images/up.svg
new file mode 100644
index 00000000..999b2bfb
--- /dev/null
+++ b/examples/iot-dashboard/images/up.svg
@@ -0,0 +1,3 @@
+<svg width="10" height="6" viewBox="0 0 10 6" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M5.00007 1.91155L8.8891 5.64431C8.98509 5.73807 9.1436 5.73584 9.24183 5.63984L9.92498 4.97232C10.0232 4.87632 10.0254 4.72005 9.92944 4.62628L5.1809 0.0675035C5.13179 0.0183883 5.06481 -0.00393677 5.00007 0.000528336C4.93309 -0.00170422 4.86835 0.0206208 4.81924 0.0675035L0.0706933 4.62628C-0.0253045 4.72005 -0.0230719 4.87632 0.0751584 4.97232L0.758305 5.63984C0.856536 5.73584 1.01504 5.73807 1.11104 5.64431L5.00007 1.91155Z" fill="#929CB2"/>
+</svg>
diff --git a/examples/iot-dashboard/iot-dashboard.pro b/examples/iot-dashboard/iot-dashboard.pro
index b4c040c2..b1273538 100644
--- a/examples/iot-dashboard/iot-dashboard.pro
+++ b/examples/iot-dashboard/iot-dashboard.pro
@@ -4,11 +4,13 @@ SOURCES += \
     Card.cpp \
     CircularProgressBar.cpp \
     DaytimeSkin.cpp \
+    IndoorTemperature.cpp \
     MainContent.cpp \
     MenuBar.cpp \
     PieChart.cpp \
     PieChartPainted.cpp \
     PieChartSkinlet.cpp \
+    RoundedIcon.cpp \
     TopBar.cpp \
     Usage.cpp \
     main.cpp \
@@ -18,12 +20,14 @@ HEADERS += \
     Card.h \
     CircularProgressBar.h \
     DaytimeSkin.h \
+    IndoorTemperature.h \
     MainContent.h \
     MainWindow.h \
     MenuBar.h \
     PieChart.h \
     PieChartPainted.h \
     PieChartSkinlet.h \
+    RoundedIcon.h \
     TopBar.h \
     Usage.h