Home
MD Fardous Alom
pages / slides

pages / slides

Forked from> @laurits/sticky-fullpage-pages-slides

This tailwind example is contributed by MD Fardous Alom, on 16-Jan-2025. Component is made with Tailwind CSS v3. It is responsive. It supports dark mode.

Other Widget

Author MD Fardous Alom

1.5k

Fork Fullscreen

<div class="relative">
    <div class="sticky top-0 h-screen flex flex-col items-center justify-center bg-gradient-to-b from-green-200 to-blue-200">
        <h2 class="text-4xl font-bold">The First slide</h2>
        <p class="mt-2">Scroll Down now for next slide</p>
    </div>
    <div class="sticky top-0 h-screen flex flex-col items-center justify-center bg-gradient-to-b from-indigo-800 to-purple-800 text-white">
        <h2 class="text-4xl font-bold">The Second slide</h2>
        <p class="mt-2">Scroll Down for next slide</p>
    </div>
    <div class="sticky top-0 h-screen flex flex-col items-center justify-center bg-gradient-to-b from-purple-800 to-pink-800 text-white">
        <h2 class="text-4xl font-bold">The Third slide</h2>
        <p class="mt-2">Scroll Down</p>
    </div>
    <div class="sticky top-0 h-screen flex flex-col items-center justify-center bg-gradient-to-b from-blue-200 to-indigo-100 text-black">
        <h2 class="text-4xl font-bold">The Fourth slide</h2>
    </div>
</div>

Related Examples

Simple count down timer

Author:
Gopi Yadav

3 years ago

15.3k
Sticky fullpage pages / slides

Author:
Laurits

2 years ago

15.8k
Periodic Table with Tailwind CSS

Author:
Michael Andreuzza

1 year ago

2.8k
Calculator
This calculator uses CSS although it can be passed directly to tailwind

Author:
Ameth Galarcio

1 year ago

2.2k
Sticky fullpage pages / slides

Author:
Hasan AlDoy (McDoy)

1 year ago

1.5k
Sticky fullpage pages / slides
Sticky full page

Author:
harinandana

4 months ago

463
Visernic Profile

Author:
MD Mostafa Niloy

4 months ago

502
Hero Section
Responsive Hero Section for you Project Background Image: A stunning, high-quality Unsplash photo that creates a unique visual impact. Overlay: Semi-transparent black overlay with blur effect for readability and a modern aesthetic. Content Area: Centered with a gradient background overlay for contrast, bold headline, engaging subtext. Buttons: Vibrant gradient and clean border with smooth hover animations to draw attention. Responsive Design: Looks great on all screen sizes with adaptable padding and font sizes.

Author:
KULDEEP

8 months ago

1.5k
Popover
basic popover example

Author:
Dipti narayan

2 years ago

13.1k
partql
partql

Author:
sh22gr

1 month ago

171
Simple layout

Author:
Edward Carandang

1 year ago

3.2k
Play Music - Reproductor
Multimedia music player, with its respective dark mode

Author:
Ameth Galarcio

1 year ago

2.7k

Explore components by Tags

Didn't find component you were looking for?

Search from 3000+ components