Design System
The visual identity and component library for NEON VOID. Neo-brutalist aesthetics meet analog nostalgia.
Logo
// THE NEON VOID BRAND MARK
On Light Background
Primary usage on light backgrounds
On Dark Background
Alternative usage on dark backgrounds
Logo Sizes
24px
40px (Header)
64px
96px
Color Palette
// THE CORE COLORS THAT DEFINE THE NEON VOID IDENTITY
Paper
#F0F0F0
--color-paper
Black
#000000
--color-black
Acid Yellow
#FAFF00
--color-acid
Hot Pink
#FF0099
--color-pink
Cyan
#00F0FF
--color-cyan
Typography
// FOUR FONT FAMILIES FOR DIFFERENT PURPOSES
Headlines & Heroes
Section Titles
Subheadings
Body text for longer content. The Archivo font family provides excellent readability for paragraphs and article content while maintaining a modern, slightly condensed feel.
Regular weight for supporting text and descriptions. Clean and professional.
// USED FOR TAGS, DATES, AND CODE-LIKE ELEMENTS
ISSUE_047 // 2026.02.25 // 8 MIN READ
[HARDWARE] [AUDIO] [GAMING]
NAVIGATION LINKS
[BUTTON_LABELS] [FORM_INPUTS]
System status messages and metadata
Buttons
// INTERACTIVE ELEMENTS WITH NEO-BRUTALIST STYLING
Variants
Sizes
With Icons
Hacked Button (Hover)
Badges
// LABELS AND CATEGORY INDICATORS
Filled
Outline
Accent
Inputs
// FORM ELEMENTS FOR USER INTERACTION
Default Input
Terminal Input
Cards
// CONTENT CONTAINERS WITH VARIOUS STYLES
Default Card
With image and hover effects
Accent Left
Pink accent border on the left side
Accent Left
Cyan accent border variant
Visual Effects
// SHADOWS, BORDERS, AND ANIMATIONS
Hard Shadows
Grayscale Image (Hover to colorize)
Marquee Ticker
// SCROLLING ANNOUNCEMENT BAR