Neo Brutalism
Classic neo-brutalism landing page with high contrast and raw aesthetics.
Main Features of Neo Brutalism
How to Use Neo Brutalism in Next.js
Installation Guide for Neo Brutalism
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
primaryColor | string | #000000 | Primary raw color (black). |
accentColor | string | #ff006e | High contrast accent color. |
shadowOffset | string | 8px | Offset for brutalist shadows. |
borderWidth | string | 4px | Border width for raw elements. |
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.
When to Use
Best Practices
Why This Component Matters in Modern UI Development
Frequently Asked Questions
QWhat is the difference from 'Neo-Brutalist'?
The 'Neo-Brutalism' variant focuses on higher contrast and raw, vibrant color pairings (like black and hot pink) compared to the more geometric variant.
QCan I change the primary neon?
Yes, the `accentColor` prop (default #ff006e) allows you to set the primary 'Pop' color for the entire raw interface.
QIs it mobile friendly?
The raw elements stack into a high-impact vertical grid on mobile, ensuring that the bold lines and shadows remain legible and effective.