Home

Salem Cobalt#

Principal Frontend Engineer, Design Systems Expert#

Boston-based frontend engineer with 14+ years specializing in design systems used at scale — component API architecture, design token pipelines, and theming systems — with deep expertise in React, TypeScript, headless UI primitives, web components, accessibility, and AI-assisted (agentic) development workflows.

Work Experience#

Independent Software Consultant, Midnight Mansion (April 2026 – May 2026)

  • Frontend architecture consulting, plus agent-driven refactoring and migration workflows (Claude Code) across the client's full-stack codebase
  • Designed and shipped a highly interactive physical mini-game for Edge of Elsewhere, their upcoming immersive venue — MCU programming, a centralized SSE-based control system, WebSockets, and a collection of fully playable levels

VP of Engineering – Frontend Architecture, Pypestream (January 2023 – March 2026)

  • Architected and helped build Pypestream's cross-platform (Lit + React-wrapped) design system — built on headless UI primitives (Base UI, Floating UI, TanStack Table) and adopted company-wide across 5+ next-gen products
  • Baked WCAG 2.1 AA accessibility — keyboard navigation, focus management, ARIA patterns — directly into the design system, so every downstream product inherited it
  • Owned the company-wide frontend re-platforming: unified 7+ disjointed product repos and shared UI libraries into a single TypeScript monorepo, centralizing how everything is built, tested, documented, deployed, and maintained
  • Drove a 4x increase in frontend release frequency and 50%+ faster CI/CD — even as the number of centrally managed apps grew — saving thousands in infrastructure costs
  • Led pragmatic AI coding-agent adoption across frontend teams (Cursor, Claude Code) and AI-assisted code review (CodeRabbit) — shipping production code with agents while raising, not lowering, the code-quality bar
  • Led a distributed team of 9 full-stack / senior frontend engineers; technical lead on the greenfield rebuild of Pypestream's core management platform, which directly supported $1M+ in Fortune 500 contract renewals and expansions

Principal Frontend Engineer, Knapsack (May 2020 – January 2023)

  • Rebuilt the entire frontend UI for Knapsack's flagship "design system as a platform" product — the tool enterprise design system teams use to build, document, theme, and ship their own design systems
  • Co-developed the codemod systems powering the core product, including an inheritance-based UI theming system that lets customer brands customize the product's appearance without compromising accessibility or slowing product iteration
  • Architected the end-to-end design token pipeline: Style Dictionary definitions consumed as CSS custom properties, Sass mixins, and auto-generated TypeScript typings
  • Built, tested, and shipped major UI/UX-heavy iterations of the product's modular block-based editor — React, XState, GraphQL, and TypeScript throughout

Lead Frontend Architect, Pegasystems (July 2016 – May 2020)

  • Frontend development lead and creator of the Bolt Design System, powering the UI across Pega's 5+ corporate sites and 7+ microsites
  • Drove Pega's web frontend consolidation onto Bolt — the fragmentation → migration → adoption arc — through design system summits, cross-team component API workshops, and long-term maintainability practices later featured in my 2019 conference talks
  • Planned, built, documented, tested, released, and maintained the system's frontend deliverables: highly accessible components, patterns, design tokens, docs & demos, CI/CD, and dev tooling
  • Developed centrally maintained, shared Lit-based web components with deep CMS integration (Drupal 8 + custom Twig extensions), and authored the Sass-based CSS architecture and theming used by engineers, designers, and content authors

Frontend Architect, Genuine Interactive (March 2012 – March 2016)

  • Built front-end websites & apps for clients including Angry Orchard, Samuel Adams, Panera Bread, and Akamai
  • Consulted on, architected, and built best-in-class responsive, mobile, and desktop sites; early design system advocate

Specializations#

  • Design Systems
  • Scalable Frontend Architecture
  • Web Components
  • CSS Architecture
  • Web Performance
  • AI-Assisted (Agentic) Engineering

Technical Skills#

Design Systems & Component APIs

  • Headless / unstyled UI primitives (Base UI, Material UI, Floating UI, TanStack Table) deeply integrated into design system components
  • Component API design; design system theming systems
  • Design token pipelines (Style Dictionary, Figma-to-code)
  • Type-safe styling (Vanilla Extract); automated, versioned design system docs

React & Modern Full Stack

  • React, XState, MobX, Next.js, React Router
  • Auth0, Kratos, Sentry, Datadog
  • Playwright, Vitest, Cypress, Percy, Lost Pixel

AI Tooling & Engineer Efficiency

  • Claude Code, Cursor, CodeRabbit — daily production use
  • Led sensible team adoption and AI-assisted code review
  • Agent workflows for large-scale refactoring and migration

Web Component Architecture

  • TypeScript-typed Lit elements with React integration
  • Progressive enhancement, accessibility, i18n
  • Native form behavior (ElementInternals); extensive Shadow DOM experience
  • Server-side rendering via Twig / Node

CSS Architecture

  • Scalable BEM / ITCSS Sass architecture
  • CSS custom properties, theming systems, design token management
  • Advanced animation & interaction patterns; modular (fluid) typography & layout

Web Performance

  • Re-render optimization, ES Modules, tree shaking
  • Responsive images (intrinsic ratio, average-color / base64 placeholders, lazy loading), Critical CSS, async font loading
  • Auditing, monitoring & instrumentation — SpeedCurve, Lighthouse, Web Vitals; Cloudinary, Imgix

Frontend DevOps & Automation

  • Monorepo management (Yarn, NX, Lerna), CI/CD (GitHub Actions)
  • Serverless functions & middleware (Vercel, Cloudflare Workers)
  • Visual regression (Percy, Lost Pixel); monitoring (Sentry, Datadog)
  • Automated release pipelines (NPM publishing, GitHub releases, release notes, Slack notifications)

Frontend Tools & Bundling

  • Vite, Rollup, Babel, ESLint, Prettier, TypeScript
  • GraphQL, Hasura, URQL
  • Storybook, Pattern Lab, 11ty; automated docs & schema APIs; Figma + VS Code plugins

Contact Me#

Achievements#

Open Source

  • Former Lead Maintainer + core contributor of Pattern Lab

Podcasts

Awards

  • Pega’s Business Operations Team Award for Innovation: Q1, 2019

Conference Talks & Speaking