ComponentsHero

A beautiful hero section with a title, a supporting headline, image, social proof and CTA.

A Header component for CodeLaunch boilerplate
terminal

Tips

  1. Your <h1> should answer this question in less than 10 words: "Why should a random visitor stay on your site for more than 10 seconds?".
    Write about the pain it's relieving, the problem it's solving, or the pleasure it's giving.
  2. The supporting headline explain how you deliver what your promise in the title.
  3. Your CTA should start with a verb (i.e. Get, Discover, Learn, etc.)
  4. Social proof = trust = more conversions. Offer the product to a few people for free in exchange for a genuine testimonial.
  5. The image is a like YouTube thumbnail. It should be super easy to understand what your product does just by looking at it.
  6. The <Problem /> section should follow this Hero section

Looking for UI-only components like buttons, inputs, etc? It's all available as Tailwind utilities. See this guide for more info.