Brutalism
Bold neo-brutalist landing page with high contrast and geometric shapes.
Props
| Property | Type | Default | Description |
|---|---|---|---|
| primaryColor | string | #121212 | Primary dark color. |
| accentColor | string | #ccff00 | High contrast accent color (lime). |
| secondaryColor | string | #a855f7 | Secondary accent color (purple). |
| shadowOffset | string | 8px | Offset for brutalist shadow effects. |
| borderWidth | string | 4px | Border width for geometric elements. |
When to Use
Perfect for bold startups, NFT marketplaces, and Next.js applications that want a high-energy 'Brutalism' aesthetic. Use this full-page template for a high-contrast experience with geometric shapes, lime accents, and thick architectural borders.
Best Practices
Maintain scalable component architecture by keeping labels short and colors high-contrast. Follow React best practices by pairing this with bold typography. Optimize for performance by using GSAP for the complex grid transforms.
Why This Component Matters
Neo-brutalist aesthetics communicate structural honesty and digital energy. This production-ready UI template helpsคุณ build an interface that feels solid and unyielding, breaking away from standard 'soft' design trends.
FAQ
QWhat is the GSAP dependency?
This template uses GSAP and Lenis for ultra-smooth layout transitions and performance-optimized geometric animations across the entire page.
QCan I change the lime accent?
Yes, the `accentColor` prop sets the primary highlight tone for all buttons and geometric focal points in the brutalist layout.
QIs it mobile responsive?
The brutalist modules stack into a high-impact vertical grid on mobile, ensuring that the bold lines and shadows remains legible and effective.
Related Components
Cartoonish
Playful cartoon-style hero section with fun animations and vibrant colors.
Draggable
Interactive hero section with draggable elements and smooth physics-based interactions.
Glass Operating System
Glassmorphism hero section with frosted glass effects and modern OS-inspired design.