Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
AppFolio
ProptechAppFolio presents a commanding, navy-anchored aesthetic that exudes enterprise-grade authority with approachable warmth. The massive Helvetica Now Display headlines create an imposing, institutional presence while the strategic use of bright sky blue accents prevents the design from feeling corporate-sterile. The composition balances serious B2B credibility with human-centered accessibility.
Design Identity
Signature Color
AppFolio Deep Navy
#05094f
enterprise stability and unwavering reliability in property management software
Visual Identity
Dramatic typographic hierarchy with massive navy headlines dominating the left side, creating an unmistakable weight and presence that feels both authoritative and grounded.
Component Style
Solid, high-contrast buttons with generous rounded corners (approximately 24px) that feel substantial and trustworthy. Clean pill-shaped forms with bold color fills and no shadows - everything emphasizes reliability over flashiness.
Spacing Philosophy
Generous 64px grid margins create breathing room for the large typography, while the asymmetrical split-layout uses whitespace to create clear content hierarchies and prevent cognitive overload.
Design Principles
- Headlines use Helvetica Now Display at massive scales (44px-90px) for maximum impact
- Button radius consistently around 24px for approachable pill shapes
- Navy (#05094f) dominates for authority, sky blue (#009eff) for accent highlights
- 64px grid margins maintain consistent spatial rhythm
- Body text stays at 16px for accessibility and readability
Target Audience
Property management professionals and real estate operators who need enterprise-grade software but value human-centered design over sterile corporate interfaces
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 | normal | |
| h1 | 90px | 400 | 90px | |
| h2 | 60px | 400 | 61.2px | |
| h3 | 44px | 400 | 49.28px | |
| p | 14px | 400 | 21px | |
| a | 14px | 400 | 21px | |
| button | 12px | 400 | 16.8px | |
| nav | 16px | 400 | normal | |
| footer | 17.9956px | 400 | 25.1938px |
Color Palette
#7accff#cde9f9#009eff#08428d#05094f#edf0f4#465670#1e2430#eae3ff#8073ff#3e3260#e9f7ed
