High energy onboarding
A maximalist, neobrutalist design system featuring unconventional geometric typography, high-contrast colors, and interactive card stacking. Built for energetic SaaS onboarding, creative platforms, or experimental fintech interfaces. Uses Clash Display and Satoshi fonts with hard shadows (#2D1B4E), vibrant accents in orange (#FF7D2E) and cyan (#00D4FF), and a signature noise-textured background overlay.
Summary
Superdesign is a high-energy, unconventional design system that blends neobrutalist hard-shadow aesthetics with modern glassmorphism. It utilizes a striking contrast between deep purple and vibrant neon accents, anchored by dramatic geometric display typography. The layout is structured around interactive 'Identity Calibration' modules and 'Card Stacking' mechanics, perfect for apps that prioritize personality and creative engagement.
Style
The style is characterized by its 'Hard-Shadow' neobrutalism and maximalist color palette. Typography pairings use Clash Display for bold, experimental headlines and Satoshi for clean, readable body text. Visual depth is achieved through animated background blobs, a constant 7% opacity noise grain, and 4px-8px solid-color offset shadows rather than blurs.
Layout & Structure
A dual-pane layout featuring a centered, wide content area for onboarding/input and a fixed 'Live Echo' preview sidebar for real-time visualization.
Navigation Header
Hero Entrance Section
Identity Selection Grid
Interactive Card Stack
DNA Toggle Grid
Components
Orbital Intelligence Dial
A complex circular interaction module representing AI involvement levels.
Live Echo Panel
A sticky glassmorphism sidebar that acts as a terminal and preview area.