→ java stories story
→ Hero Parallaxx

Hero Parallaxx

This bootstrap css example is contributed by java stories story, on 17-Sep-2025. Component is made with bootstrap css v.5.3. It is responsive.

Tags: Hero

Author java stories story

2.4k

v.5.3

Fork Fullscreen

<head>
  <link
    rel="stylesheet"
    href="https://cdn.jsdelivr.net/npm/parallaxx-js/dist/parallax.css"
  />
</head>
<body>
  <div
    class="parallax"
    data-speed="0.5"
    data-image="https://picsum.photos/id/1018/1000/600">

<div
      class="position-absolute"
      style="
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        background-color: rgba(0, 0, 0, 0.6);
      "
    ></div>

<div class="text-center p-5 position-relative">
      <span class="text-uppercase text-whitefw-bold"
        >Kesegaran dalam Setiap Tegukan</span>
      <h1 class="mb-4 mt-2 fw-bold">Nikmati kopi dengan Varian Rasa Lezat</h1>
      <div class="d-flex justify-content-center flex-wrap gap-2">
        <a href="#produk" class="btn btn-warning btn-lg rounded-pill px-5 me-2"
          >Lihat Menu</a
        >
        <a
          href="#contact"
          class="btn btn-outline-warning btn-lg rounded-pill px-5 pt-2"
          >Hubungi Kami</a
        >
      </div>
    </div>
  </div>

<section class="100vh" style="min-height: 100vh"></section>
  
  <script src="https://cdn.jsdelivr.net/npm/parallaxx-js/dist/parallax.js"></script>
</body>

More Examples

marquee track

Author:
Juan Antonio González Hernández

1 month ago

366

v.4.6
Hero Section with Animations
Interactive hero section with animated elements, key statistics, and modern styling

Author:
Isaac Winslow

1 year ago

7k

v.5.3
portfolio

Author:
Ad Apon7

1 day ago

19

v.5.3
Basic hero
Hero section with background image

Author:
Prajwal Hallale

2 years ago

4.4k

v.4.6
mision and vission

Author:
Ad Apon7

3 days ago

37

v.5.3
Gradient Hero Section
A visually stunning hero section with a gradient background and a call-to-action button.

Author:
Prajwal Hallale

2 years ago

5.3k

v.5.3
portfolio

Author:
Ad Apon7

1 day ago

16

v.4.6
Gradient Hero Section with Pulsing Button

Author:
Ranadhir Debnath

7 months ago

1.3k

v.5.3
Simple hero
Hero section with a linear gradient

Author:
Moana silva

1 year ago

2.7k

v.4.6
Simple hero section

Author:
Mateo Rojas

1 year ago

7k

v.5.3
Animated hero section

Author:
Anonymous

2 years ago

7.2k

v.5.3
Clean hero section with image

Author:
Prajwal Hallale

2 years ago

3.4k

v.5.3

Didn't find component you were looking for?

Search from 300+ componenent

BootstrapExamples From the makers of tailwindflex.com

BootstrapExamples is a free library offering a diverse range of Bootstrap CSS components. Developed by the community, it's open for anyone to use.

Contacts

Email:

[email protected]

Links

Search

Resources

Free Tailwind CSS Components Free CSS Components

© 2026 BootstrapExamples. All Rights Reserved.

v1.3