Design System
Problem
There is a lack of consistent and repetitive design work, poor collaboration, and slow development cycles. Different designers and developers often create variations of the same UI elements, which leads to a fragmented user experience.
Solution
Design and build an enterprise design system to ensure UI consistency across all channels. Documenting design decisions that can be replicated at scale costs organizations time and money. The key goal is to prevent duplication of efforts, leading to a better overall quality of work at efficient speeds.
Evolution of FYBR
In 2013, Brad Frost’s Atomic Design methodology inspired me to build Frontier’s design system—now known as FYBR. Since then, I’ve refined FYBR across Photoshop → Adobe XD → Figma, with each iteration enhancing modular clarity and scalability.
Logos
Color
Accessibility
This is a list of color combinations of our color palette that pass WCAG 2.0 color contrast guidelines.
Combinations displayed here meet the AAA, AA, or AA large WCAG performance levels for contrast. AAA and AA combinations are safe to use at any type size. AA Large combinations (18.6px or above) are safe for large text.
Typography
Imagery
Iconography
Grid System
Scale = 4px, Border =2px
UI
Marketing
