RoastWeb Logo - Brutalist Style
Full Logo (Default)
Small (32px)
Medium (48px)
Large (64px)
XL (96px)
Icon Only
16px
24px
32px
48px
64px
128px
Horizontal Layout
Small (32px)
Medium (48px)
Large (64px)
Minimal (For Favicons)
16px
32px
64px
128px
On Dark Background
Yellow
Red
Blue
Brutalist Design Principles
- 🔲Bold Geometric Shapes: Angular flame icon with sharp, clean edges
- ⚫High Contrast: Black borders (6px stroke) against vibrant orange background
- 🎨Limited Color Palette: Orange (#FF6B35), Yellow (#FFD93D), White, Black
- 📐Raw & Direct: No gradients, shadows, or subtle effects
- 💪Strong Typography: ALL CAPS, ultra-bold tracking-tight
- 🔥Symbolic: Fire/flame represents "roasting" with geometric interpretation
Usage Examples
// Default full logo
<Logo size={48} />
// Icon only (no text)
<Logo variant="icon" size={32} showText={false} />
// Horizontal layout
<LogoHorizontal size={48} />
// Minimal (for favicons)
<LogoMinimal size={32} />
// Custom sizes
<Logo size={96} />
<Logo size={128} />
// With custom className
<Logo size={48} className="my-custom-class" />