Rosetta

01 · THE PROBLEMEvery team was rebuilding the same button

Handshake's product surface spanned three distinct audiences — students, employers, and universities — each with its own visual identity, built by separate teams. The same primitives were being re-implemented in parallel, drifting apart in accessibility, behavior, and look. Design reviews were spent relitigating decisions that had already been made somewhere else.

02 · THE CONSTRAINTSThree brands, one codebase, zero forced migrations

The bet was a single component tree that could render three complete themes without a single if (brand) branch — and an adoption model with no mandate. Teams had to choose Rosetta because it was better, not because a memo said so.

// Themes are data. Components are projections of it.
const THEMES = { student, employer, university } as const;

export function RosettaProvider({ brand, children }: ProviderProps) {
  return (
    <ThemeContext.Provider value={THEMES[brand]}>
      {children}
    </ThemeContext.Provider>
  );
}

03 · THE SYSTEM135 components, one contract

Every component followed the same contract: tokens in, markup out, no brand awareness. Variants were closed enums instead of boolean sprawl. Accessibility was baked into the primitive, not left to the consumer. The library shipped with its own linting rules, codemods for every breaking release, and a documented public roadmap.

Teams had to choose it because it was better, not because a memo said so. That constraint shaped every API decision.

04 · THE OUTCOMEThe default, not the mandate

Rosetta became the default choice for new surfaces across the organization — 135+ components, three complete themes, adopted by teams supporting 160+ engineers. It outlived team reorgs, brand refreshes, and its author's tenure, which is the only metric a platform bet really has.

• Organization-wide adoption across student, employer, and university surfaces
• Codemods shipped with every breaking release — no team left behind
• Design-review time shifted from relitigating primitives to product decisions
• Became the delivery vehicle for accessibility and brand consistency at scale

Let's build the
next brag.