Brandon Lambert Design System
Color Palette
A carefully curated color system designed for consistency, accessibility, and visual harmony across all interfaces.
Accent Dark
1a365d
Accent
2c5282
Accent Light
3182ce
Dark
333333
Medium
666666
Light
999999
Background
f7fafc
Surface
ffffff
Typography
Typography establishes hierarchy, improves readability, and creates emotional connection through carefully selected typefaces.
Display Heading
The Academic Portfolio
Font
Crimson Text
Size
48px
Weight
700
Line Height
1.2
Section Heading
Research & Development
Font
Crimson Text
Size
32px
Weight
600
Line Height
1.3
Body Text
This design system provides a comprehensive foundation for building consistent, accessible, and beautiful user interfaces. It combines modern design principles with practical implementation guidelines.
Font
Inter
Size
16px
Weight
400
Line Height
1.6
Interactive Playground
Experiment with components and customize properties in real-time to see how they adapt to different configurations.
Button Customizer
Implementation
Clean, maintainable code examples with best practices and accessibility considerations built in.
HTML / CSS