Home
Gbenga Adegoke
Extra large hero

Extra large hero

This tailwind example is contributed by Gbenga Adegoke, on 14-Mar-2023. Component is made with Tailwind CSS v3. It is responsive.

Hero

Author Gbenga Adegoke

10.2k

Fork Fullscreen

<div class="bg-gray-100 font-sans">
    <div class="container mx-auto px-4 py-8">
        <nav class="flex justify-between items-center">
            <a href="#" class="font-bold text-xl text-indigo-600">My Site</a>
            <div>
                <a href="#" class="text-gray-600 hover:text-gray-900 mx-4">Home</a>
                <a href="#" class="text-gray-600 hover:text-gray-900 mx-4">About</a>
                <a href="#" class="text-gray-600 hover:text-gray-900 mx-4">Contact</a>
                <a href="#" class="text-gray-600 hover:text-gray-900 mx-4">Blog</a>
            </div>
        </nav>
        <div class="flex flex-col justify-center items-center my-16">
            <h1 class="text-5xl font-bold text-gray-800 leading-tight">Welcome to My Site</h1>
            <p class="text-2xl text-gray-600 mt-4">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do
                eiusmod tempor incididunt ut labore et dolore magna aliqua.</p>
            <button class="bg-indigo-600 hover:bg-indigo-700 text-white text-xl mt-8 py-4 px-8 rounded-lg">Get Started</button>
        </div>
    </div>
</div>

Related Examples

No distraction search field

Author:
_Amar_

2 years ago

11.9k
Hero section responsive

Author:
Samuel Dawson

2 years ago

14.7k
Product Page
Showcase for the product.

Author:
Prem..

3 years ago

30.9k
Hero component

Author:
Freja Jensen

2 years ago

12.7k
Hero section with search

Author:
TailwindFlex

3 years ago

11.5k
Hero Section

Author:
Gbenga Adegoke

2 years ago

9.7k
Responsive Portfolio Webpage with Tailwind CSS
This is a reusable and responsive portfolio webpage template created with HTML and Tailwind CSS. Designed for developers or creatives, the template includes essential sections like Header, Hero, About, Skills, Experience, Projects, Testimonials, Contact Form, and Footer. It features a clean, modern design and is fully customizable without requiring JavaScript. Perfect for showcasing personal or professional work on the web.

Author:
Ayyamperumal S

7 months ago

1.5k
Hero section with a gradient background
With text overlay, and a call-to-action button

Author:
Anonymous

2 years ago

19k
Very simple hero

Author:
Laurits

2 years ago

8.6k
Hero section with bold heading

Author:
Abigail

2 years ago

11.4k
Hero section
Hero section for your project

Author:
Prajwal Hallale

3 years ago

9k
Hero section with big heading

Author:
Leon Bachmann

2 years ago

11.5k

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components