Help us build this. Leave comments, suggest improvements, and help create better design documentation for agents.
Casetext
Legal TechCoCounsel combines professional authority with approachable AI sophistication through a rich forest green backdrop that conveys trustworthiness and expertise. The design balances corporate gravitas with modern accessibility, using warm orange accent colors and flowing abstract lines to suggest AI-powered innovation within traditional professional services.
Design Identity
Signature Color
Professional Forest
#2d4a3a
Legal authority merged with AI innovation - trustworthy expertise that feels both established and forward-thinking
Visual Identity
Flowing white line art against deep green backgrounds creates a distinctive 'AI visualization' aesthetic that immediately signals intelligent technology, while professional card-based layouts maintain corporate credibility.
Component Style
Clean white cards with subtle rounded corners and minimal shadows float against rich backgrounds. Orange accent arrows and icons provide warmth and direction. Components feel substantial but not heavy - professional without being sterile.
Spacing Philosophy
Generous whitespace within cards (32px+ padding) creates breathing room for complex professional concepts, while tight 2-6px gaps between related elements maintain information density that busy professionals expect.
Design Principles
- Orange (#ff4500 range) serves as the primary accent for CTAs and navigation elements
- Cards maintain consistent white backgrounds with subtle shadows for content separation
- Typography hierarchy uses Source Sans 3 for body text and Clario for headings
- Border radius stays moderate (8-12px) - professional but approachable
- Abstract flowing lines suggest AI processing without being overly technical
Target Audience
Senior legal, tax, audit, and accounting professionals who need AI assistance but require enterprise-grade reliability and industry-specific expertise over generic productivity tools
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 | 16px | 400 | 20px | |
| h2 | 24px | 500 | 28.8px | |
| h3 | 16px | 400 | 20px | |
| p | 14px | 500 | 16.8px | |
| a | 16px | 400 | 24px | |
| button | 16px | 500 | 24px | |
| input | 16px | 400 | 18.4px | |
| nav | 16px | 400 | 24px | |
| footer | 16px | 400 | 24px |
Color Palette
#005da2#9647d1#f7f7f7#d2d2d2#ededed#edf6ff#0062c4#666666#ffffff#f84335#404040#ffeded
