User Profile

A user profile is a directory of stored user settings and information for the related user account.

Profile Cover Card

mentor 1

Jitu Chauhan

Software Engineer at Apple 7+ years in UX Design & Brand Design.
Save Ask questions
5.0 (16 Reviews)
40+ Mentees
Gujarat,India

Skills

Frontend HTML CSS React Javascript Vuejs Next.js
Quick Responder 
<div class="card">
  <!--img-->
  <div class="rounded-top-3" style="background-image: url(../assets/images/mentor/mentor-single.png); background-position: center; background-size: cover; background-repeat: no-repeat; height: 228px"></div>
  <div class="card-body p-md-5">
    <div class="d-flex flex-column gap-5">
      <!--img-->
      <div class="mt-n8">
        <img src="../assets/images/mentor/mentor-img-single.jpg" alt="mentor 1" class="img-fluid rounded-4 mt-n8">
      </div>
      <div class="d-flex flex-column gap-5">
        <div class="d-flex flex-column gap-3">
          <div class="d-flex flex-md-row flex-column justify-content-between gap-2">
            <!--heading-->
            <div>
              <h1 class="mb-0">Jitu Chauhan</h1>
              <!--content-->
              <div class="d-flex flex-lg-row flex-column gap-2">
                <small class="fw-medium text-gray-800">Software Engineer&nbsp;at&nbsp;Apple</small>
                <small class="fw-medium text-success">7+ years in UX Design &amp; Brand Design.</small>
              </div>
            </div>
            <!--button-->
            <div class="d-flex flex-row gap-3 align-items-center">
              <a href="#!" class="btn btn-outline-white">
                <span>
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-heart-fill me-1" viewBox="0 0 16 16">
                    <path fill-rule="evenodd" d="M8 1.314C12.438-3.248 23.534 4.735 8 15-7.534 4.736 3.562-3.248 8 1.314"></path>
                  </svg>
                </span>
                Save
              </a>
              <a href="#!" class="btn btn-outline-white">Ask questions</a>
            </div>
          </div>
          <div class="d-flex flex-md-row flex-column gap-md-4 gap-2">
            <div class="d-flex flex-row gap-2 align-items-center lh-1">
              <!--icon-->
              <span>
                <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-star-fill text-warning align-baseline" viewBox="0 0 16 16">
                  <path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"></path>
                </svg>
              </span>
              <span>
                <!--text-->
                <span class="text-gray-800 fw-bold">5.0</span>
                (16&nbsp;Reviews)
              </span>
            </div>
            <div class="d-flex flex-row gap-2 align-items-center lh-1">
              <!--icon-->
              <span>
                <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-people-fill text-primary align-baseline" viewBox="0 0 16 16">
                  <path d="M7 14s-1 0-1-1 1-4 5-4 5 3 5 4-1 1-1 1zm4-6a3 3 0 1 0 0-6 3 3 0 0 0 0 6m-5.784 6A2.24 2.24 0 0 1 5 13c0-1.355.68-2.75 1.936-3.72A6.3 6.3 0 0 0 5 9c-4 0-5 3-5 4s1 1 1 1zM4.5 8a2.5 2.5 0 1 0 0-5 2.5 2.5 0 0 0 0 5"></path>
                </svg>
              </span>
              <!--text-->
              <span>
                <span class="text-gray-800 fw-bold">40+</span>
                Mentees
              </span>
            </div>
            <div class="d-flex flex-row gap-2 align-items-center lh-1">
              <!--icon-->
              <span>
                <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-geo-alt-fill text-danger" viewBox="0 0 16 16">
                  <path d="M8 16s6-5.686 6-10A6 6 0 0 0 2 6c0 4.314 6 10 6 10m0-7a3 3 0 1 1 0-6 3 3 0 0 1 0 6"></path>
                </svg>
              </span>
              <!--text-->
              <span>Gujarat,India</span>
            </div>
          </div>
        </div>
        <div class="d-flex flex-column gap-2">
          <!--heading-->
          <h3 class="mb-0">Skills</h3>

          <div class="gap-2 d-flex flex-wrap">
            <a href="#!" class="btn btn-tag btn-sm">Frontend</a>
            <a href="#!" class="btn btn-tag btn-sm">HTML</a>
            <a href="#!" class="btn btn-tag btn-sm">CSS</a>
            <a href="#!" class="btn btn-tag btn-sm">React</a>
            <a href="#!" class="btn btn-tag btn-sm">Javascript</a>
            <a href="#!" class="btn btn-tag btn-sm">Vuejs</a>
            <a href="#!" class="btn btn-tag btn-sm">Next.js</a>
          </div>
        </div>
        <div>
          <span class="badge rounded-pill text-success-emphasis bg-success-subtle border border-success align-items-center">
            <span>
              <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-reply-fill me-1 align-text-top" viewBox="0 0 16 16">
                <path d="M5.921 11.9 1.353 8.62a.72.72 0 0 1 0-1.238L5.921 4.1A.716.716 0 0 1 7 4.719V6c1.5 0 6 0 7 8-2.5-4.5-7-4-7-4v1.281c0 .56-.606.898-1.079.62z"></path>
              </svg>
            </span>
            Quick Responder
          </span>
        </div>
      </div>
    </div>
  </div>
</div>

Profile Card

mentor 1

Akshay Sharma

Software Engineer
@ Microsoft
5yrs Exp.
5.0 (12 Reviews)
Starting from

$25.00

/ Month 
          <div class="card rounded-4 card-bordered card-lift"><div class="p-3 d-flex flex-column gap-3">
<!--img-->
<a href="#!">
<img src="../assets/images/mentor/mentor-img-1.jpg" alt="mentor 1" class="img-fluid w-100 rounded-4">
</a>
<!--content-->
<div class="d-flex flex-column gap-4">
<div class="d-flex flex-column gap-2">
<div>
<div class="d-flex align-items-center gap-2">
<h3 class="mb-0">
<a href="#!" class="text-reset">Akshay Sharma</a>
</h3>
<span>
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-patch-check-fill text-success" viewBox="0 0 16 16">
<path d="M10.067.87a2.89 2.89 0 0 0-4.134 0l-.622.638-.89-.011a2.89 2.89 0 0 0-2.924 2.924l.01.89-.636.622a2.89 2.89 0 0 0 0 4.134l.637.622-.011.89a2.89 2.89 0 0 0 2.924 2.924l.89-.01.622.636a2.89 2.89 0 0 0 4.134 0l.622-.637.89.011a2.89 2.89 0 0 0 2.924-2.924l-.01-.89.636-.622a2.89 2.89 0 0 0 0-4.134l-.637-.622.011-.89a2.89 2.89 0 0 0-2.924-2.924l-.89.01zm.287 5.984-3 3a.5.5 0 0 1-.708 0l-1.5-1.5a.5.5 0 1 1 .708-.708L7 8.793l2.646-2.647a.5.5 0 0 1 .708.708"></path>
</svg>
</span>
</div>
<span class="text-gray-800">Software Engineer</span>
</div>

<div class="d-flex align-items-center justify-content-between fs-6">
<div>
<span>@ Microsoft</span>
<div class="vr mx-2 text-gray-200"></div>
<span>5yrs Exp.</span>
</div>
<div class="d-flex gap-1 align-items-center lh-1">
<svg xmlns="http://www.w3.org/2000/svg" width="12" height="12" fill="currentColor" class="bi bi-star-fill text-warning" viewBox="0 0 16 16">
<path d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z"></path>
</svg>

<span class="fw-bold text-dark">5.0</span>
<span>(12 Reviews)</span>
</div>
</div>
</div>
<div class="d-flex flex-row justify-content-between align-items-center">
<div>
<span>Starting from</span>
<div class="d-flex flex-row gap-1 align-items-center">
<h4 class="mb-0">$25.00</h4>
<span class="fs-6">/ Month</span>
</div>
</div>
<div>
<a href="#!" class="btn btn-outline-primary" data-bs-toggle="modal" data-bs-target="#signupModal">Book a Free Trial</a>
</div>
</div>
</div>
</div>
</div>

Profile With Counter

YOUR INSTRUCTOR

Hi, I’m James Davies,
I will be taking you through lessons.

Create beautiful website with this Geeks UI template. Get started building a site today.

45

Lessons

10,500+

Students

12+

Learning Hours

<div class="py-8 ">
  <div class="container">
    <div class="row mb-6 align-items-center justify-content-center">
      <div class="col-md-10">
        <div class="row align-items-center ">
          <div class="col-xl-6 col-lg-7 col-md-12 col-12 order-1 text-center text-lg-start ">
            <!-- caption -->
            <span class="text-primary mb-3 d-block text-uppercase fw-semibold ls-xl">YOUR INSTRUCTOR</span>
            <h2 class="mb-2 display-4 fw-bold mb-3">Hi, I’m <span class="text-primary">James Davies</span>,
              <br>I will be taking you through lessons.</h2>
            <p class="fs-3 pe-6">Create beautiful website with this Geeks UI template. Get started building a
              site today.</p>

            <hr class="my-5">
              <!-- Counter -->
            <div class="row">
              <div class="col-sm mb-3 mb-lg-0">
                <h2 class="h1 fw-bold mb-0 ls-xs">45</h2>
                <p class="mb-0">Lessons</p>
              </div>
              <div class="col-lg-5 col-sm mb-3 mb-lg-0">
                <h2 class="h1 fw-bold mb-0 ls-xs">10,500+</h2>
                <p class="mb-0">Students</p>
              </div>
              <div class="col-sm mb-3 mb-lg-0">
                <h2 class="h1 fw-bold mb-0 ls-xs">12+</h2>
                <p class="mb-0">Learning Hours</p>
              </div>
            </div>
          </div>
            <!-- Img -->
          <div class="offset-xl-1 col-xl-5 col-lg-5 col-12 mb-6 mb-lg-0 order-lg-2 text-center ">
            <img src="../assets/images/instructor/instructor-img.png" alt="" class="img-fluid">
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

Card Contact

Wade Warren

United States

Message
Enrolled 3/12/2020
Progress 0% 
<div class="col-lg-4 col-md-6 col-12">
    <!-- Card -->
    <div class="card mb-4">
        <!-- Card Body -->
        <div class="card-body ">
            <div class="text-center">
                <img src="../assets/images/avatar/avatar-3.jpg" class="rounded-circle avatar-xl mb-3" alt="">
                <h4 class="mb-1">Wade Warren</h4>
                <p class="mb-0 fs-6"><i class="fe fe-map-pin me-1"></i>United
                    States</p>
                <a href="#" class="btn btn-sm btn-outline-secondarymt-3 ">Message</a>
            </div>
            <div class="d-flex justify-content-between border-bottom py-2 mt-4 fs-6">

                <span>Enrolled</span>
                <span class="text-dark"> 3/12/2020</span>
            </div>
            <div class="d-flex justify-content-between pt-2 fs-6">
                <span>Progress</span>
                <span class="text-success"> 0% </span>
            </div>
        </div>
    </div>
</div>

Card Profile

Wade Warren

Web Developer, Designer

Students 50,274
Instructor Rating 4.5
Courses 12 
 <div class="col-xl-4 col-lg-6 col-md-6 col-12">
<!-- Card -->
<div class="card">
  <!-- Card Body -->
  <div class="card-body">
    <div class="text-center">
      <img src="../assets/images/avatar/avatar-1.jpg" class="rounded-circle avatar-xl mb-3" alt="">
      <h4 class="mb-0">Wade Warren</h4>
      <p class="mb-0">Web Developer, Designer</p>
    </div>
    <div class="d-flex justify-content-between border-bottom py-2 mt-4">
      <span>Students</span>
      <span class="text-dark">50,274</span>
    </div>
    <div class="d-flex justify-content-between border-bottom py-2">
      <span>Instructor Rating</span>
      <span class="text-warning">
        4.5 <span class="">
          <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"
            fill="currentColor" class="bi bi-star-fill text-warning" viewBox="0 0 16 16">
            <path
              d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z" />
          </svg>
      </span>
    </div>
    <div class="d-flex justify-content-between pt-2">
      <span>Courses</span>
      <span class="text-dark"> 12 </span>
    </div>
  </div>
</div>
</div>

User Profile Page header

Jenny Wilson

@Jennywilson

<div class="row align-items-center">
   <!-- User Info -->
   <div class="col-xl-12 col-lg-12 col-md-12 col-12">
      <div class="pt-8 rounded-top-md" style="background: url(../assets/images/background/profile-bg.jpg) no-repeat; background-size: cover;"></div>
      <div class="d-flex align-items-end justify-content-between bg-white px-4 pt-2 pb-4 rounded-none rounded-bottom-md shadow-sm">
         <div class="d-flex align-items-center">
            <div class="me-2 position-relative d-flex justify-content-end align-items-end mt-n5">
               <img src="../assets/images/avatar/avatar-1.jpg" class="avatar-xl rounded-circle border border-4 border-white" alt="">
               <a href="#" class="position-absolute mb-6 me-n2" data-bs-toggle="tooltip" data-placement="top" title="" data-original-title="Verified">
               <img src="../assets/images/svg/checked-mark.svg" alt="" height="30" width="30">
               </a>
            </div>
            <div class="lh-1">
               <h2 class="mb-0">Jenny Wilson</h2>
               <p class="mb-0 d-block">@Jennywilson</p>
            </div>
         </div>
         <div>
            <a href="add-course.html" class="btn btn-primary btn-sm d-none d-md-block">Create New Course</a>
         </div>
      </div>
   </div>
</div>

Profile

Jenny Wilson

Front-end Developer, Designer

4.5 Instructor Rating
11,604
Students
32
Courses
12,230
Reviews

I am an Innovation designer focussing on UX/UI based in Berlin. As a creative resident at Figma explored the city of the future and how new technologies.

View Details 
 <div class="card">
                          <!-- Card Body -->
                          <div class="card-body">
                            <div class="d-flex align-items-center">
                              <div class="position-relative">
                                <img src="../assets/images/avatar/avatar-1.jpg" alt="" class="rounded-circle avatar-xl">
                                <a href="#" class="position-absolute mt-2 ms-n3" data-bs-toggle="tooltip"
                                  data-placement="top"  title="Verifed">
                                  <img src="../assets/images/svg/checked-mark.svg" alt="" height="30" width="30">
                                </a>
                              </div>
                              <div class="ms-4">
                                <h4 class="mb-0">Jenny Wilson</h4>
                                <p class="mb-1 fs-6">Front-end Developer, Designer</p>
                                <span class="text-warning lh-1 d-flex align-baseline">
                                  4.5<span class="fs-6 mx-1">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="12" height="12"
                                      fill="currentColor" class="bi bi-star-fill text-warning" viewBox="0 0 16 16">
                                      <path
                                        d="M3.612 15.443c-.386.198-.824-.149-.746-.592l.83-4.73L.173 6.765c-.329-.314-.158-.888.283-.95l4.898-.696L7.538.792c.197-.39.73-.39.927 0l2.184 4.327 4.898.696c.441.062.612.636.282.95l-3.522 3.356.83 4.73c.078.443-.36.79-.746.592L8 13.187l-4.389 2.256z" />
                                    </svg>
                                </span>Instructor Rating
                                </span>
                              </div>
                            </div>
                            <div class="border-top row mt-3 border-bottom mb-3 g-0">
                              <div class="col">
                                <div class="pe-1 ps-2 py-3">
                                  <h5 class="mb-0">11,604</h5>
                                  <span>Students</span>
                                </div>
                              </div>
                              <div class="col border-start">
                                <div class="pe-1 ps-3 py-3">
                                  <h5 class="mb-0">32</h5>
                                  <span>Courses</span>
                                </div>
                              </div>
                              <div class="col border-start">
                                <div class="pe-1 ps-3 py-3">
                                  <h5 class="mb-0">12,230</h5>
                                  <span>Reviews</span>
                                </div>
                              </div>
                            </div>
                            <p>I am an Innovation designer focussing on UX/UI based in Berlin. As a creative
                              resident at Figma explored the city of the future and how new technologies.</p>
                            <a href="#" class="btn btn-outline-secondary btn-sm">View
                              Details</a>
                          </div>
                        </div>