Bootstrap framework snippet dashboard user block

This bootstrap framework snippet "dashboard user block" was designed to help people of all skill levels - designer or developer,
huge nerd or early beginner. copy and paste the code. Use it as a complete kit or use it to start something more complex.
tags: user,dashboard,block


<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css" rel="stylesheet"> <div class="container bootstrap snippet"> <div class="col-md-4"> <!-- START widget--> <div class="panel widget"> <div class="panel-body bg-danger text-center"> <div class="clearfix"> <div class="pull-left">200 Following</div> <div class="pull-right">150 Followers</div> </div> <img src="https://bootdey.com/img/Content/user_3.jpg" alt="Image" class="img-thumbnail img-circle thumb96"> <h4 class="mt0">Lois Berry</h4> <p class="m0"> <em class="fa fa-fw fa-map-marker"></em>San Francisco, California</p> <div class="clearfix"> <div class="pull-left">15k Likes</div> <div class="pull-right">100 Feeds</div> </div> </div> </div> <!-- END widget--> </div> <div class="col-md-4"> <!-- START widget--> <div class="panel widget"> <div class="panel-body bg-primary text-center"> <div class="clearfix"> <div class="pull-left">200 Following</div> <div class="pull-right">150 Followers</div> </div> <img src="https://bootdey.com/img/Content/user_1.jpg" alt="Image" class="img-thumbnail img-circle thumb96"> <h4 class="mt0">Michael chenlyy</h4> <p class="m0"> <em class="fa fa-fw fa-map-marker"></em>San Francisco, California</p> <div class="clearfix"> <div class="pull-left">15k Likes</div> <div class="pull-right">100 Feeds</div> </div> </div> </div> <!-- END widget--> </div> <div class="col-md-4"> <!-- START widget--> <div class="panel widget"> <div class="panel-body bg-info text-center"> <div class="clearfix"> <div class="pull-left">200 Following</div> <div class="pull-right">150 Followers</div> </div> <img src="https://bootdey.com/img/Content/user_2.jpg" alt="Image" class="img-thumbnail img-circle thumb96"> <h4 class="mt0">Margareth Danky</h4> <p class="m0"> <em class="fa fa-fw fa-map-marker"></em>San Francisco, California</p> <div class="clearfix"> <div class="pull-left">15k Likes</div> <div class="pull-right">100 Feeds</div> </div> </div> </div> <!-- END widget--> </div> </div>
body{margin-top:20px;} .widget .panel, .widget.panel { overflow: hidden; } .widget { margin-bottom: 20px; border: 0; } .bg-danger { background-color: #f05050; color: #fff!important; } .bg-info { background-color: #23b7e5; color: #fff!important; } .bg-primary { background-color: #5d9cec; color: #fff!important; }

Creator of this snippet

Dey Dey

Bootstrap version: 3.3.4

Created: Jun 7th 2015, 12:37

Views: 2.8K