View Demo Buy Now Our Portfolio

Navigation Style

Horizontal Left-menu

Skin Modes

Default Mode
White Mode
Dark Mode

Header Styles Mode

Light Menu
Dark Menu
Color Menu
Graident Menu

Horizontalmenu Styles Mode

Color Menu
Light Menu
Dark Menu
Gradient-Color Menu
Loader
logo
View all Notification
3
See all Messages
img
English
flag-img
French
flag-img
Germany
flag-img
Italy
flag-img
Russia
flag-img
Spain
profile-user
Jacob Fisher
My Profile Edit Profile Account Settings Inbox Message Need help? Sign out

Avatar-Radius

  1. Elements
  2. Avatar-Radius
Add Order Add User

Simple avatar

<div class="avatar-list">
                            <span class="avatar bradius cover-image" data-image-src="https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/1.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/2.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/1.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/2.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/3.jpg"></span>
                        </div>

Avatar size

<div class="avatar-list">
                            <span class="avatar avatar-sm bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/4.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/3.jpg"></span>
                            <span class="avatar avatar-md bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/5.jpg"></span>
                            <span class="avatar avatar-lg bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/6.jpg"></span>
                            <span class="avatar avatar-xl bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/4.jpg"></span>
                            <span class="avatar avatar-xxl bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/7.jpg"></span>
                        </div>

Avatar status

<div class="avatar-list">
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/8.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/5.jpg">
                                <span class="avatar-status bg-secondary"></span>
                            </span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/9.jpg">
                                <span class="avatar-status bg-red"></span>
                            </span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/6.jpg">
                                <span class="avatar-status bg-green"></span>
                            </span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/7.jpg">
                                <span class="avatar-status bg-yellow"></span>
                            </span>
                        </div>

Avatars list

+8 
<div class="avatar-list avatar-list-stacked">
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/10.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/8.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/9.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/10.jpg"></span>
                            <span class="avatar bradius cover-image" data-image-src= "https://laravel.spruko.com/yoha/Horizontal-Light-rtl/assets/images/users/11.jpg"></span>
                            <span class="avatar bradius">+8</span>
                        </div>
General Settings
Notifications
Show your emails
Show Task statistics
Show recent activity
System Logs
Error Reporting
Show your status to all
Keep up to date
Overview

Achieves80%

Projects60%

Earnings50%

Balance45%

Toatal Profits75%

Total Likes70%