Components
Loading preview...
Preplex Hero Section This is a hero section made for a waitlist page. The background uses vertical red and black bars that fade upward. The text in the middle says redefining what's possible and below that it says one experience at a time in italics. Under that there is a line that tells people to be the first to know when the product launches and to join the waitlist for early access. At the top right there is a join the waitlist button. In the center above the heading there is a small section with profile images and a number that shows how many people are already on the waitlist. In this case it says 2 point 4 K currently on the waitlist. Below the main heading there is a rounded input field that says enter your email. Next to that there is a button that says join the waitlist. Both of these are centered and placed near the bottom of the hero section. At the very bottom there are small icons for social links like Instagram LinkedIn and GitHub. At the top left the brand name There is a basic menu with links for features vision press and contact. The layout is centered. The text is clear and uses large font sizes.
npx shadcn@latest add https://21st.dev/r/waleedkibhen/gradient-bar-hero-sectionimport { Component } from "@/components/ui/gradient-bar-hero-section";
const DemoOne = () => {
return (
<div className="flex w-full h-screen justify-center items-center bg-black">
<Component />
</div>
);
};
export { DemoOne };