Home
KULDEEP
Heading

Heading

Subtle Script Background - Large, very light script font in the background ("Amazing")

Light-to-Dark Gradient Heading - Main heading fades from light gray to dark gray

Layered Typography - Secondary heading in medium weight for contrast

Elegant Divider - With centered italic text

Minimalist Border Accents - Thin borders in corners for sophistication

Responsive Design - Scales beautifully on all devices

This tailwind example is contributed by KULDEEP, on 22-Jun-2025. Component is made with Tailwind CSS v3. It is responsive. similar terms for this example are Typography, Title, h1, h2, h3

Team Heading Other

Author KULDEEP

187

Fork Fullscreen

<section class="relative py-20 px-4 sm:px-6 lg:px-8 overflow-hidden bg-gray-50">
  
  <div class="absolute inset-0 flex items-center justify-center opacity-5">
    <p class="text-[10rem] md:text-[20rem] font-script tracking-wide leading-none text-gray-400 select-none">Amazing</p>
  </div>
  
  <div class="relative max-w-7xl mx-auto text-center">
    
    <h1 class="mb-8 text-5xl md:text-7xl lg:text-8xl font-bold tracking-tight">
      <span class="bg-clip-text text-transparent bg-gradient-to-b from-gray-300 via-gray-500 to-gray-800">
        Stunning Visual
      </span>
      <span class="block text-4xl md:text-5xl lg:text-6xl font-medium text-gray-600 mt-4">Heading Effect</span>
    </h1>
    
    
    <div class="relative my-10">
      <div class="absolute inset-0 flex items-center">
        <div class="w-full border-t border-gray-200"></div>
      </div>
      <div class="relative flex justify-center">
        <span class="px-4 bg-gray-50 text-xl text-gray-500 font-serif italic">
          Elegant & Modern
        </span>
      </div>
    </div>
    
    
    <p class="max-w-2xl mx-auto text-xl text-gray-600 font-light leading-relaxed">
      This design features a subtle script background with a beautiful light-to-dark gradient heading that creates depth and visual interest.
    </p>
  </div>
  
  
  <div class="absolute top-0 left-0 w-32 h-32 border-t-2 border-l-2 border-gray-300"></div>
  <div class="absolute bottom-0 right-0 w-32 h-32 border-b-2 border-r-2 border-gray-300"></div>
</section>

Related Examples

Fancy underline

Author:
Simon Scheffer

2 years ago

11.8k
Career Page
This is a career page component built in tailwind

Author:
Deepak Sharma

8 months ago

752
Table
Table with image and status with pagination buttons

Author:
Abhiraj

8 months ago

1.9k
Ai clone, chat ui
Chat interface for ai builder, dont toomuch focused on designing responsive

Author:
Abhiraj

7 months ago

1.3k
DailyDev Card
Card -based card used in the Dailydev Card, this is created to be modified to taste of each user

Author:
Ameth Galarcio

7 months ago

1.4k
A Code Master Academy
A Code Master Academy – Empowering the Next Generation of Tech Leaders in Rwanda 👨‍💻 I'm Acode Master, the founder of A Code Master Academy, a practical and inclusive coding school based in Rubavu, Rwanda. The academy is dedicated to transforming lives by equipping unemployed youth and passionate learners with job-ready skills in modern software development.

Author:
Code Master(Mfuranziza Dusabe Hamza)

3 months ago

704
Heading Style

Author:
KULDEEP

3 months ago

336
Team Members

Author:
Abdul Baset Bappy

3 months ago

380
Heading

Author:
KULDEEP

2 months ago

417
Contact Us / Enquiry-form Responsive

Author:
KULDEEP

2 months ago

674
Clean & Responsive Footer Design with Tailwind CSS With CTA Button
modern and responsive footer built with Tailwind CSS to enhance website navigation, accessibility, and user experience. Featuring quick links, social media icons, copyright info, and a sleek layout, this SEO-friendly footer improves engagement and usability across all devices. Perfect for portfolios, business websites, and eCommerce stores!

Author:
Abdul Baset Bappy

5 months ago

571
Subscription Plans
Subscription Plans

Author:
Tanvir Hasan Bappy (Tanvir)

4 months ago

617

Explore components by Tags

Didn't find component you were looking for?

Search from 2400+ components