Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Spiber
BiotechSpiber creates a sophisticated biotech aesthetic that merges organic textures with clean typography, using their custom 'Spiber' typeface to communicate scientific precision wrapped in natural materials. The brown-gold fiber texture background paired with crisp white text evokes both laboratory innovation and the raw materials they engineer.
Design Identity
Signature Color
Spiber Gold
#8B6914
natural innovation - representing the golden fibers of engineered spider silk and premium biotechnology
Visual Identity
The combination of organic, fibrous textures as full-screen backgrounds with minimal white typography overlay - creating a tactile materials science feel that no other biotech company uses.
Component Style
Clean geometric buttons with subtle rounded corners (approximately 24px radius), no shadows or heavy borders. Everything feels weightless and precise, letting the organic background textures provide visual interest while UI elements remain clinical and unobtrusive.
Spacing Philosophy
Generous whitespace around text blocks creates breathing room against busy organic textures. Large typography (60px headlines) demands significant vertical spacing, while navigation elements cluster tightly in the header for efficiency.
Design Principles
- Typography never goes below 11px, maintaining scientific legibility
- Headlines use 500 weight, body uses 400 - no extremes in font weight
- Full-screen textured backgrounds with minimal UI overlay
- White text on organic textures for maximum contrast
- Custom 'Spiber' font family across all elements for brand consistency
Target Audience
Materials scientists, biotech investors, and sustainability-focused manufacturers who value cutting-edge science with environmental consciousness
Mood
Design descriptions are AI-generated based on visual analysis and may not fully reflect the brand's official design guidelines.
Design System
Typography Scale
| Element | Font | Size | Weight | Line Height |
|---|---|---|---|---|
| body | 16px | 400 | 24px | |
| h1 | 60px | 500 | 66px | |
| h2 | 48px | 400 | 57.6px | |
| h3 | 24px | 500 | 36px | |
| h6 | 11px | 700 | 16.5px | |
| p | 24px | 500 | 36px | |
| a | 16px | 400 | 24px | |
| button | 11px | 700 | 27.5px | |
| nav | 16px | 400 | 24px | |
| footer | 16px | 400 | 24px |
Color Palette
#007aff#3b82f6#ffffff
