Hero Sections

A hero sections is a full screen section typically consisting of a background image, or video, or illustrations, or animations, with text.


Hero #1

// import custom components
import HeroTypedMentors from 'components/marketing/common/hero-sections/HeroTypedMentors';
// import required data files
import MentorListData from 'data/marketing/mentor/MentorListData';
export const Hero1Example = () => {
return <HeroTypedMentors
title='Learn a new skill, launch a project, land your dream career.'
typedBefore='1-on-1'
typedArray={['Javascript', 'Startup', 'React', 'Marketing', 'Branding']}
typedAfter='Mentorship'
tags={['Frontend', 'Devops', 'UI/UX designer', 'Data Science', 'Full Stack', 'Backend', 'Data Analyst']}
marqueeData={MentorListData}
/>
}

Hero #2

Learn today’s most in-demand-skills

Classes & Courses website template to start creating your stunning website. All templates are fully customizable.

  • No credit card required
  • Customer service 24/7
  • No setup fee
  • Cancel any time
Explore Online Courses
graphics-2
online course
graphics-1
// import custom components
import HeroEducationRightImage from "components/marketing/common/hero-sections/HeroEducationRightImage";
export const Hero2Example = () => {
return <HeroEducationRightImage
headingPart1='Learn today’s most in-'
headingPart2='demand-skills'
description='Classes & Courses website template to start creating your stunning website. All templates are fully customizable.'
bulletArray={['No credit card required', 'Customer service 24/7', 'No setup fee', 'Cancel any time']}
buttonText='Explore Online Courses'
buttonLink='#'
/>
}

Hero #3

Most trusted education platform

Grow your skills and advance career

Start, switch, or advance your career with more than 5,000 courses, Professional Certificates, and degrees from world-class universities and companies.

Join Free NowWatch Demo
// import custom components
import HeroAcademy from "components/marketing/common/hero-sections/HeroAcademy";
export const Hero3Example = () => {
return <HeroAcademy
bulletArray={['Most trusted education platform']}
title='Grow your skills and advance career'
description='Start, switch, or advance your career with more than 5,000 courses, Professional Certificates, and degrees from world-class universities and companies.'
buttonText='Join Free Now'
buttonLink='#'
youTubeVideoID='JRzWRZahOVU' />
}

Hero #4

Find your dream job that you love to do.

The largest remote work community in the world. Sign up and post a job or create your developer profile.

Currently listing 30,642 jobs from 5,717 companies
// import custom components
import HeroFindJobs from "components/marketing/common/hero-sections/HeroFindJobs";
export const Hero4Example = () => {
return <HeroFindJobs
title='Find your dream job that you love to do.'
description='The largest remote work community in the world. Sign up and post a job or create your developer profile.'
totalJobs={30642}
totalCompanies={5717}
/>
}

Hero #5

Modern web apps shipped faster

Simple to use, beautiful UI design
Complete complex project with ease
An intuitive admin app for developers
TRUSTED BY MILLIONS OF DEVELOPERS & THOUSANDS OF ENTERPRISE TEAMS
// import custom components
import HeroGradient from 'components/marketing/common/hero-sections/HeroGradient';
// import required data files
import LogoList2 from 'data/marketing/clientlogos/LogoList2';
export const Hero5Example = () => {
return <HeroGradient
title='Modern web apps shipped faster'
bulletArray={['Simple to use, beautiful UI design', 'Complete complex project with ease', 'An intuitive admin app for developers']}
buttonText='Get started for Free'
buttonLink='#'
hrefText='Questions? Talk to an expert'
hrefLink='#'
logos={LogoList2}
/>
}

Hero #6

Beta-v2.0.0 - Just shipped version

Request Access for Product

Geeks is a customizable, Bootstrap based UI Kits and Templates for Developers.

Rated 5 Stars by over 100+ Users
// import custom components
import HeroFormCenter from "components/marketing/common/hero-sections/HeroFormCenter";
export const Hero6Example = () => {
return <HeroFormCenter
badgeText='<span class="fw-bold">Beta-v2.0.0 </span> - Just shipped version'
title='Request Access for Product'
description='Geeks is a customizable, Bootstrap based UI Kits and Templates for Developers.'
promotionalText='Rated 5 Stars <span class="text-muted">by over</span> <span class="text-primary"> 100+ Users</span>'
/>
}

Hero #7

Become a Vanilla JavaScript Developer

In this tutorial, we are going to learn about JavaScript (Vanilla JS) - for building incredible, powerful JavaScript applications.

4 Hours
12 Videos
10,234+ Enrolled
Watch Preview

Create Free Account

OR
// import custom components
import HeroFormRight from "components/marketing/common/hero-sections/HeroFormRight";
export const Hero7Example = () => {
return <HeroFormRight
title='Become a Vanilla JavaScript Developer'
description='In this tutorial, we are going to learn about JavaScript (Vanilla JS) - for building incredible, powerful JavaScript applications.'
hours={4}
videos={12}
enrolled={10234}
buttonText='Watch Preview'
buttonLink='#'
/>
}

Hero #8

Build BetterSkills|

Build skills with courses Join Geeks to watch, play, learn, make, and discover, uscipit esi viimentum laoreet non et odio.

View PlansTry for Free
  • 30,000 online courses
  • Expert instruction
  • Lifetime access
// import custom components
import HeroTypedCourses from "components/marketing/common/hero-sections/HeroTypedCourses";
export const Hero8Example = () => {
return <HeroTypedCourses
typedBefore='Build Better'
typedArray={['Skills', 'Products', 'Teams', 'Future']}
description='Build skills with courses Join Geeks to watch, play, learn, make, and discover, uscipit esi viimentum laoreet non et odio.'
bulletArray={['30,000 online courses', 'Expert instruction', 'Lifetime access']}
buttonText1='View Plans'
buttonLink1='#'
buttonText2='Try for Free'
buttonLink2='#'
/>
}

Hero #9

Welcome to Geeks UI Learning Application

Hand-picked Instructor and expertly crafted courses, designed for the modern students and entrepreneur.

Browse Courses Are You Instructor?
// import custom components
import HeroHeaderDefault from "components/marketing/pages/courses/course-index/HeroHeaderDefault";
export const Hero9Example = () => {
return <HeroHeaderDefault
title='Welcome to Geeks UI Learning Application'
description='Hand-picked Instructor and expertly crafted courses, designed for the modern students and entrepreneur.'
buttonText1='Browse Courses'
buttonLink1='/marketing/courses/course-filter-page/'
buttonText2='Are You Instructor?'
buttonLink2='/authentication/sign-in/'
/>
}

Hero #10

Welcome to the Geeks Abroad Study

Powering Your Global Education Dream

Explore top universities and unique cultural experiences worldwide.

Enquire now
4.8
Engaged Students
Highly Qualified Teachers
Online and Offline classes
International Recognition
// import custom components
import HeroStudyAbroad from 'components/marketing/common/hero-sections/HeroStudyAbroad';
export const Hero10Example = () => {
return <HeroStudyAbroad
title='Powering Your Global Education Dream'
subTitle='Welcome to the Geeks Abroad Study'
description='Explore top universities and unique cultural experiences worldwide.'
buttonText='Enquire now'
buttonLink='#'
rating={4.8}
ratingText = 'Engaged Students'
feature1='Highly Qualified Teachers'
feature2='Online and Offline classes'
feature3='International Recognition'
/>
}

Hero #11

🚀Empower Your Learning Journey Today

The #1 Courses Learning Platform

Hands-on training, and certifications to help you get the most from Geeks Learning.

Expert Instructors
Flexible Learning
Supportive Community
50+ Courses
Certified Courses
Online Project
70,324+
Students Preparing with us
// import custom components
import HeroLearningPlatform from 'components/marketing/common/hero-sections/HeroLearningPlatform';
export const Hero11Example = () => {
return <HeroLearningPlatform
title='The #1 Courses Learning Platform'
subTitle='Empower Your Learning Journey Today'
description='Hands-on training, and certifications to help you get the most from Geeks Learning.'
bulletArray={['Expert Instructors', 'Flexible Learning', 'Supportive Community']}
buttonText1='Join For Free'
buttonLink1='#'
buttonText2='Explore Courses'
buttonLink2='#'
feature1='50+ Courses'
feature2='Certified Courses'
feature3='Online Project'
statistics='70,324+'
statisticsText='Students Preparing with us'
/>
}
Buy Now