Tiles

Tiles Exclusively on Avalon

With our CSS-Only tiles you can easily show quick stats without the buzz and fuzz of any javascript plugins. It can be clickable if you wrap it in a a tag, or not if it's in a div

9,172

Page Views This week
+121%
S
M
T
W
T
F
S

$25,501

Total Sales This week
-37%
S
M
T
W
T
F
S

812

Total Orders This week
+98%
S
M
T
W
T
F
S

Info Tiles

<a class="info-tiles tiles-info">
    <div class="tiles-heading">
        <div class="pull-left">New Members</div>
        <div class="pull-right"><i class="fa fa-caret-up"></i> 9.8%</div>
    </div>
    <div class="tiles-body">
        <div class="pull-left"><i class="fa fa-group"></i></div>
        <div class="pull-right">125</div>
    </div>
</a>

Shortcut Tiles

Shortcut tiles can be used to focus on links and can even contain notifications

<a href="#" class="shortcut-tiles tiles-info">
    <div class="tiles-body">
        <div class="pull-left"><i class="fa fa-home"></i></div>
        <div class="pull-right"><span class="badge">2</span></div>
    </div>
    <div class="tiles-footer">
        Project Home
    </div>
</a>

Infobar

  • Total Revenue

    $241,750 +13.6%

  • Products Sold

    11,562 +19.2%

  • Total Orders

    1,249 -10.5%

Demo Settings
Fixed Header
Boxed Layout
Collapse Leftbar
Collapse Rightbar
Horizontal Icons
Header Colors
Sidebar Colors
Boxed Layout Options