Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Foodics
Restaurant TechFoodics embodies professional restaurant technology with extreme minimalism and generous whitespace. The IBM Plex typography creates a technical yet approachable personality, while the stark white canvas suggests enterprise-grade reliability without intimidation.
Design Identity
Signature Color
Foodics Black
#000000
professional authority and restaurant industry precision
Visual Identity
Extreme whitespace dominance with surgical typography placement - the brand uses negative space as the primary design element, creating an almost editorial magazine-like sophistication.
Component Style
Invisible UI philosophy - components blend seamlessly into white backgrounds with minimal visual weight, relying on typography hierarchy rather than decorative elements or heavy styling.
Spacing Philosophy
Cathedral-like spacing with massive white expanses that dwarf content elements, creating a sense of premium positioning and uncluttered focus typical of high-end B2B tools.
Design Principles
- Typography carries 90% of visual hierarchy through weight variations (400-600)
- White background (#ffffff) dominates with minimal accent color usage
- 24px base spacing unit creates consistent rhythmic intervals
- IBM Plex Sans Arabic suggests Middle Eastern market specialization
- Shadows exist in tokens but invisible in actual implementation
Target Audience
Restaurant owners and managers in Arabic-speaking markets who need enterprise POS solutions but want approachable, non-intimidating software
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 | 18px | 400 | 27px | |
| h1 | 46px | 600 | 55.2px | |
| h2 | 40px | 600 | 60px | |
| h3 | 32px | 600 | 42px | |
| h4 | 16px | 600 | 24px | |
| h6 | 16px | 600 | 24px | |
| p | 12px | 400 | 16px | |
| a | 18px | 400 | 27px | |
| button | 16px | 400 | 24px | |
| nav | 18px | 400 | 27px |
Color Palette
#000000#abb8c3#ffffff#f78da7#cf2e2e#ff6900#fcb900#7bdcb5#00d084#8ed1fc#0693e3#9b51e0
