Design System · Everest

Everest Design System

Replacing a 15-year-old legacy UI with a modern token-based design system—enabling 60+ designers and 200+ engineers to ship with clarity, consistency, and speed

Everest Design System
Click to enlarge
The Problem

15 years of technical debt, one broken system

Dayforce was built on a UI framework from 2008. Hard-coded hex values everywhere. No tokens. No shared Figma library. Every team had their own component forks—200+ engineers shipping inconsistent UI across 80+ product surfaces.

Designers spent 40% of their time recreating components that already existed somewhere else. Engineers implemented the same button 32 different ways. And none of it was accessible.

Solution

A token-first system built for scale

01 Token Architecture
Semantic token taxonomy
Three-tier hierarchy: primitive → semantic → component tokens. Brand decisions separated from system structure—enabling multi-theme propagation and reducing maintenance overhead by 60%.
02 Component API Design
Design ↔ Engineering alignment
Defined component APIs in partnership with Staff Engineers—aligning Figma component properties with React prop structures via CodeConnect. One source of truth across design and code.
03 Governance Model
Contribution without fragmentation
Established proposal → review → deprecation workflows that let 60+ designers contribute while preventing system drift. Clear ownership, clear criteria for what belongs in the system.
04 Accessibility Foundation
WCAG compliance baked in
Embedded WCAG 2.1 AA behaviors directly into component architecture—keyboard navigation, focus management, color contrast ratios, ARIA patterns—so teams couldn't accidentally ship inaccessible UI.
Governance

How contributions work

Propose
Pattern request + rationale
Any team can submit a proposal. Must include: use case, scope, evidence of need across 2+ product areas.
Review
Systems team evaluation
Weekly review cycle. Assessed on: system fit, accessibility, token compliance, eng feasibility.
Build
Co-built with contributing team
Sponsoring team provides design intent + context. Systems team ensures quality, consistency, documentation.
Deprecate
Graceful retirement process
Migration guides, automated lint warnings, sunset timelines. Nothing disappears without a replacement path.
Design ↔ Engineering

Bridging Figma and production

I worked directly with Staff Engineers to define component APIs before any design was built. We aligned on prop naming, variant structures, and token references so that the Figma component properties mapped 1:1 to React props—reducing handoff friction and eliminating "lost in translation" moments.

Impact

A system the whole org uses

60%
Reduction in maintenance overhead via token architecture
60+
Designers onboarded via Office Hours & workshops
Zero
Accessibility defects in system components post-launch
Consistency
One token taxonomy applied across all Figma libraries and production codebases—design decisions propagate automatically
Efficiency
Teams ship new features in days, not weeks—no rebuilding foundations from scratch
Next Project
Notification Framework →