Minimalist Hero Section – "Less is More" Bold visual storytelling. High-contrast monochrome portrait with a vibrant yellow circle creates strong focus. Typography is large, minimal, and clear. Ideal for brands emphasizing simplicity, elegance, or personal identity.
import React from 'react';
import { Facebook, Instagram, Twitter, Linkedin } from 'lucide-react';
import { MinimalistHero } from '@/components/ui/minimalist-hero'; // Adjust the import path as needed
const MinimalistHeroDemo = () => {
const navLinks = [
{ label: 'HOME', href: '#' },
{ label: 'PRODUCT', href: '#' },
{ label: 'STORE', href: '#' },
{ label: 'ABOUT US', href: '#' },
];
const socialLinks = [
{ icon: Facebook, href: '#' },
{ icon: Instagram, href: '#' },
{ icon: Twitter, href: '#' },
{ icon: Linkedin, href: '#' },
];
return (
<MinimalistHero
logoText="mnmlst."
navLinks={navLinks}
mainText="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum ultrices, justo vel tempus."
readMoreLink="#"
imageSrc="https://cdn.21st.dev/assets/mirror/21/2172cd84238bbee1a57a87b64322655b09c2ffa4ea89acaef7e9989c3abd272d.png"
imageAlt="A portrait of a person in a black turtleneck, in profile."
overlayText={{
part1: 'less is',
part2: 'more.',
}}
socialLinks={socialLinks}
locationText="Arlington Heights, IL"
/>
);
};
export default MinimalistHeroDemo;